scratch是一種非常合適的培養(yǎng)自己的編程興趣的方式。通過拖拽的方式，可以實現(xiàn)一些游戲，小程序的開發(fā)，就像搭積木一樣，下面給大家介紹Scratch3.0 頁面初始化同時加載sb3文件的操作方法，一起看看吧！
目標文件地址：src\containers\sb-file-uploader.jsx
修改 sb-file-uploader.jsx文件， class SBFileUploader中添加componentDidMount()，代碼如下
componentDidMount() {
var _this = this;
// 作品所在存放地址
var sb3Path = null;
/**
* 必須使用 $(window).on("load",function(){});
* 否則頁面在未加載完的情況下，有些組件會來不及加載，影響二次文件保存
*/
console.log("尚未初始加載Sb3文件");
$(window).on("load",function(){
console.log("即將初始加載Sb3文件");
let reader = new FileReader();
let request = new XMLHttpRequest();
console.log("加載的資源路徑", sb3Path);
request.open('GET', sb3Path, true);
request.responseType = "blob";
request.onload = function() {
if(request.status==404){
alert("未找到sb3類型的資源文件");
location.href='/scratch';
}
let blobs = request.response
reader.readAsArrayBuffer(blobs);
reader.onload = () => _this.props.vm.loadProject(reader.result).then(() => {
analytics.event({
category: 'project',
action: 'Import Project File',
nonInteraction: true
});
_this.props.onLoadingFinished(_this.props.loadingState);
}).catch(error => {
log.warn(error);
});
}
request.send();
});
}
目標文件地址：src\components\menu-bar\menu-bar.jsx
修改 menu-bar.jsx文件， class MenuBar 中初始SBFileUploader，代碼如下
// 必須加載這個文件
import SBFileUploader from '../../containers/sb-file-uploader.jsx';
class MenuBar extends React.Component {
render () {
return (
Box
className={classNames(
this.props.className,
styles.menuBar,
{[styles.saveInProgress]: this.props.isUpdating}
)}
>
SBFileUploader onUpdateProjectTitle={PropTypes.func} /** 初始化加載文件到項目 **/>
{(className, renderFileInput, loadProject) => (
button onClick={loadProject} className={classNames(styles.scratchHide)}>/button>
)}
/SBFileUploader>
/Box>
);
}
}
export default injectIntl(connect(
mapStateToProps,
mapDispatchToProps
)(MenuBar));
到此這篇關于Scratch3.0 頁面初始化同時加載sb3文件的操作代碼的文章就介紹到這了,更多相關Scratch頁面初始化內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:- 詳解scratch3.0二次開發(fā)之scratch-blocks中的blocks的類型、定義和使用方法
- scratch3.0二次開發(fā)之用blocks生成python代碼
- Scratch3.0二次開發(fā)之windows環(huán)境下打包成exe的流程
- 解析scratch3.0二次開發(fā)之scratch-blocks免編譯修改問題
