Vue使用七牛云上传的实例

先上代码：

	//安装相关的依赖
	npm install qiniu-js --save
	
	//引用
	import * as qiniu from 'qiniu-js';
	Vue.use(qiniu);
	
	// plupload 我这里是引用的cdn，最好是下载下来或是进行安装
	// https://cdn.staticfile.org/plupload/2.1.9/plupload.full.min.js

	<span id='pickfiles' >上传资料</span>

//初始化 
	Qiniu.uploader({
        runtimes: 'html5,flash,html4',
        browse_button: 'pickfiles',
        chunk_size: '8mb',
        bucket: " ",//命名空间
        uptoken:this.token, 
        //  JSON.stringify(that.token),
        uptoken_url: '',//获取token的地址
        unique_names: false,  
        save_key: false,//可以保存名字？？？
        domain: '',//七牛云地址
        get_new_uptoken: true,
        auto_start: true,
        // max_retries: 3,
        filters: {
          max_file_size: '500mb',
          prevent_duplicates: false
          // Specify what files to browse for
          // mime_types: [
          //     {title : 'apk files', extensions : 'apk'} // 限定apk后缀上传格式上传
          // ]
        },
        init: {
          'FilesAdded': (up, files) => {
              console.log('文件就绪', files);
              this.fileName = files[0].name
          },
          BeforeUpload: (up, file) => {
            console.log('上传之前', file);
          },
          UploadProgress: (up, file) => {
            console.log('上传中 file',file);
            console.log(file.target_name)
            this.progress = file.percent + '%';
          },
          FileUploaded: (up, file, info) => {
            console.log('文件上传完毕')
            this.$toast("上传成功")
            this.success = true;
            this.$http.post('/uac/auth/pcb/updateMaterialUrl',{orderId:this.$route.query.id,materialUrl:this.fileName,id:this.$route.query.msgId}).then((res)=>{
              console.log(res);
              console.log(this.$route.query.id)
            })
          },
          Error: (up, err, errTip) => {
            console.log('上传失败', err);
            this.$toast("上传失败")
          },
          //设置key
          Key: (up, file) => {
            var key = file.name
            return key;
          }
        }
      });