Top 7 Examples of "plupload in functional component" in JavaScript

FilesAdded: (up, files) => {
            //新增图片
            if (option.upMaxLength && files.length > option.upMaxLength) {
              plupload.each(files, (file) => {
                this.evueUploader.removeFile(file);
              });
              this.evueUploader.refresh();
              console.error('只能上传数量为：' + option.upMaxLength);

              this.$emit('upload-filesAdded', {
                code: -1,
                // allFiles: this.allFiles,
                msg: '只能上传数量为：' + option.upMaxLength,
                // uploader: this.evueUploader,
              });
              return;
            }
            this.allFiles = [];
            this.upIndex = 0;
            let num = 0;

previewImage(file, callback) {//file为plupload事件监听函数参数中的file对象,callback为预览图片准备完成的回调函数
      if (!file || !/image\//.test(file.type)) return; //确保文件是图片

      if (file.type === 'image/gif') {//gif使用FileReader进行预览,因为mOxie.Image只支持jpg和png
        let fr = new plupload.mOxie.FileReader();
//        console.log(fr);
        fr.onload = function () {
          callback(fr.result);
          fr.destroy();
          fr = null;
        };
        fr.readAsDataURL(file.getSource());
      } else {
        let preloader = new plupload.mOxie.Image();
        preloader.onload = function () {
          preloader.downsize(300, 300);//先压缩一下要预览的图片,宽300，高300
          let imgsrc = preloader.type === 'image/jpeg' ? preloader.getAsDataURL('image/jpeg', 80) : preloader.getAsDataURL(); //得到图片src,实质为一个base64编码的数据
          callback && callback(imgsrc); //callback传入的参数为预览图片的url
          preloader.destroy();
          preloader = null;
        };

}
      };
      /**是否需要拖动上传*/
      if (option.isDrop) {
        config['drop_element'] = this.browseButton;
      }
      /**
       * 配置上传类型
       * array
       * [{title: "Image files",extensions: 'gif,jpeg,jpg,png,bmp'}]
       * */
      if (option.mimeTypes) {
        config.filters['mime_types'] = option.mimeTypes;
      }

      this.evueUploader = new plupload.Uploader(config);
      this.evueUploader.init();
      this.$emit('evueUploader', this.evueUploader)
    },
    startUp() {

mounted() {
			bus.$on('start-upload', this.StartUpload);

			if (!this.isAdvancedUpload()) {
				console.log('Your browser doesn\'t support dropzone upload');
				return;
			}

			var tmpContainer = document.getElementById(this.dataName + 'container_');
			var tmpBrowse = document.getElementById(this.dataName + 'button_');

			this.uploader = new plupload.Uploader({
				runtimes: 'html5,html4',
				browse_button: tmpBrowse,
				container: tmpContainer,
				url: this.dataUpload,
				chunk_size: this.dataChunkSize,
				http_method: 'POST',
				//max_retries: 3,
				//multipart: true,
				multipart_params: this.dataOptions,
				//send_chunk_number: true,
				//send_file_name: true,
				headers: {
					'X-CSRF-TOKEN': Laravel.csrfToken,
					'Authorization': Laravel.apiToken
				},
				//required_features: 'chunks',

if (this.filters != null) {
          prop["filters"] = this.filters;
        }
        if (this.multipart_params != null) {
          prop["multipart_params"] = this.multipart_params;
        }
        if (this.resize != null) {
          prop["resize"] = this.resize;
        }
        if (this.drop_element != null) {
          prop["drop_element"] = this.drop_element;
        }
        if (this.required_features != null) {
          prop["required_features"] = this.required_features;
        }
        let uploader = new plupload.Uploader(prop);
        uploader.init();
        this.up = uploader;
      }
    },

constructor(selectorId, options){

        this.selectorId = selectorId;
        this.options = $.extend({
            headers: {

            },
            onUploaded: (response, file) => {
            },
            onError: (error) => {
                Util.dialog.message(error.code + ": " + error.message + '; ' + Translator.trans('upload.try_again_after_refresh'))
            }
        }, options);

        this.uploader = new plupload.Uploader({
            runtimes : 'html5,flash,silverlight,html4',
            browse_button : selectorId,
            url : Util.route.getRoutePath('upload'),
            file_data_name: 'file',
            filters : {
                max_file_size : '2mb',
                mime_types: [
                    {title : Translator.trans('upload.try_again_after_refresh'), extensions : "jpg,gif,png"}
                ]
            },
            headers: this.options.headers,
            init: {
                FilesAdded: function(uploader) {
                    uploader.start();
                },
                FileUploaded: (uploader, file, result) => {

mounted() { 
			var tmpContainer = document.getElementById(this.dataName + '_container_');
			var tmpBrowse = document.getElementById(this.dataName + '_button_');

			this.uploader = new plupload.Uploader({
				runtimes: 'html5,html4',
				browse_button: tmpBrowse,
				container: tmpContainer,
				url: this.dataUpload,
				chunk_size: this.dataChunkSize,
				http_method: 'POST',
				multipart_params: this.dataOptions,
				headers: {
					'X-CSRF-TOKEN': Laravel.csrfToken,
					'Authorization': Laravel.apiToken
				},
				file_data_name: this.dataName,
				filters: {
					max_file_size: this.dataMaxSize,
					mime_types: [
						{