From 78ca29fc7388ebc88e473000b5ee49969acc6a36 Mon Sep 17 00:00:00 2001 From: HFO4 <912394456@qq.com> Date: Sun, 24 Nov 2019 15:07:18 +0800 Subject: [PATCH] =?UTF-8?q?Fix:=20=E4=B8=8A=E4=BC=A0=E5=A4=B1=E8=B4=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/member/login.html | 7 +- src/component/Uploader.js | 160 ++++++++++++++++++-------------------- 2 files changed, 80 insertions(+), 87 deletions(-) diff --git a/public/member/login.html b/public/member/login.html index 282b230..41c5f56 100644 --- a/public/member/login.html +++ b/public/member/login.html @@ -29,5 +29,10 @@ }else{ ChunkSize = 10485760; } - isMobile = window.innerWidth < 600;
+ isMobile = window.innerWidth < 600; + + // 保留 + pathCache = {}; + +
diff --git a/src/component/Uploader.js b/src/component/Uploader.js index 90272bc..9280bc3 100644 --- a/src/component/Uploader.js +++ b/src/component/Uploader.js @@ -1,122 +1,113 @@ -import React, { Component } from 'react' -import scriptLoader from '../loader/index.js' -import { connect } from 'react-redux' -import { - refreshFileList, - refreshStorage -} from "../actions/index" -import FileList from "./Upload/FileList.js" +import React, { Component } from "react"; +import scriptLoader from "../loader/index.js"; +import { connect } from "react-redux"; +import { refreshFileList, refreshStorage } from "../actions/index"; +import FileList from "./Upload/FileList.js"; let loaded = false; const mapStateToProps = state => { return { - path:state.navigator.path, - } -} + path: state.navigator.path + }; +}; const mapDispatchToProps = dispatch => { return { - refreshFileList:()=>{ - dispatch(refreshFileList()) + refreshFileList: () => { + dispatch(refreshFileList()); }, - refreshStorage:()=>{ - dispatch(refreshStorage()) + refreshStorage: () => { + dispatch(refreshStorage()); } - } -} + }; +}; class UploaderCompoment extends Component { - constructor(props) { super(props); - this.state={ - queued:0, - } + this.state = { + queued: 0 + }; } - setRef(val){ - this.fileList=val; + setRef(val) { + this.fileList = val; } - cancelUpload(file){ + cancelUpload(file) { this.uploader.removeFile(file); } - shouldComponentUpdate(nextProps,nextState){ - if(nextState.queued !== this.state.queued){ - this.props.queueChange(nextState.queued); + shouldComponentUpdate(nextProps, nextState) { + if (nextState.queued !== this.state.queued) { + this.props.queueChange(nextState.queued); } return false; } componentWillReceiveProps({ isScriptLoaded, isScriptLoadSucceed }) { - if (isScriptLoaded && !this.props.isScriptLoaded) { // load finished + if (isScriptLoaded && !this.props.isScriptLoaded) { + // load finished if (isScriptLoadSucceed) { - if(loaded){ + if (loaded) { return; } loaded = true; this.uploader = window.Qiniu.uploader({ - runtimes: 'html5', - browse_button: 'pickfiles', - container: 'container', - drop_element: 'container', + runtimes: "html5", + browse_button: "pickfiles", + container: "container", + drop_element: "container", max_file_size: window.uploadConfig.maxSize, dragdrop: true, chunk_size: window.ChunkSize, filters: { - mime_types: window.uploadConfig.allowedType, + mime_types: window.uploadConfig.allowedType }, - multi_selection: !(window.moxie.core.utils.Env.OS.toLowerCase() === "ios"), + // iOS不能多选？ + multi_selection: true, uptoken_url: "/Upload/Token", domain: "s", get_new_uptoken: true, auto_start: true, log_level: 5, init: { - 'FilesAdded':({up, files})=>{ + FilesAdded: ({ up, files }) => { this.fileList["openFileList"](); - window.plupload.each(files, (files)=> { + window.plupload.each(files, files => { window.pathCache[files.id] = this.props.path; this.fileList["enQueue"](files); - }) - console.log(window.pathCache); + }); + console.log(window.pathCache); }, - - - 'BeforeUpload': function (up, file) { + + BeforeUpload: function(up, file) {}, + QueueChanged: up => { + this.setState({ queued: up.total.queued }); }, - "QueueChanged":(up=>{ - this.setState({queued:up.total.queued}); - }), - 'UploadProgress': (up, file)=>{ + UploadProgress: (up, file) => { this.fileList["updateStatus"](file); }, - 'UploadComplete': (up, file)=>{ - if(file.length===0){ - return + UploadComplete: (up, file) => { + if (file.length === 0) { + return; } - if(file[0].status === 5){ + if (file[0].status === 5) { this.fileList["setComplete"](file[0]); - this.props.refreshFileList(); + this.props.refreshFileList(); this.props.refreshStorage(); } - }, - 'FileUploaded': function (up, file, info) { - - }, - 'Error': (up, err, errTip)=>{ + FileUploaded: function(up, file, info) {}, + Error: (up, err, errTip) => { this.fileList["openFileList"](); - this.fileList["setError"](err.file,errTip); - }, - "FilesRemoved":(up, files)=>{ + this.fileList["setError"](err.file, errTip); }, + FilesRemoved: (up, files) => {} } }); - // this.fileList["openFileList"](); - } - else this.onError() + // this.fileList["openFileList"](); + } else this.onError(); } } @@ -124,40 +115,37 @@ class UploaderCompoment extends Component { // // const { isScriptLoaded, isScriptLoadSucceed } = this.props // // if (isScriptLoaded && isScriptLoadSucceed) { // // } - + // } - onError(){ + onError() {} - } - - openFileList=()=>{ + openFileList = () => { this.fileList["openFileList"](); }; - render() { return ( -
- -
+
+ +
); } - } -const Uploader = connect( - mapStateToProps, - mapDispatchToProps, - null, - {forwardRef : true} -)( scriptLoader( - ['/static/js/uploader/moxie.js'], - ['/static/js/uploader/plupload.dev.js'], - ['/static/js/uploader/i18n/zh_CN.js'], - ['/static/js/uploader/ui.js'], - ['/static/js/uploader/uploader.js'], +const Uploader = connect(mapStateToProps, mapDispatchToProps, null, { + forwardRef: true +})( + scriptLoader( + ["/static/js/uploader/moxie.js"], + ["/static/js/uploader/plupload.dev.js"], + ["/static/js/uploader/i18n/zh_CN.js"], + ["/static/js/uploader/ui.js"], + ["/static/js/uploader/uploader.js"] + )(UploaderCompoment) +); -)(UploaderCompoment)) - -export default Uploader \ No newline at end of file +export default Uploader;