vue+element+plupload上传图片组件

组件部分：

template>
  

  

    
    
    

      

      
      

        
        
      
    
    

      {{name}}
    
  
    

      

        {{Url===''?'请选择文件':pushName}}
       

        
        
      
      
      
        {{Url===''?'选择文件':'重新选择'}}
      
      
        检查
      
    
  

注：别忘了安装plupload，命令行： npm install plupload --save

引用组件：

js部分：

import ImgUpload from '@/components/Upload/ImgUploadMatch'//引入组件

export default {
  name: "SetPage",
  components: {
    ImgUpload
  },
  data() {
    return {
      images:{url:'',name:'缩略图'},
    };
  },
  methods: {
    del_img (index) {
      this.images.url = ''
    },
    add_img (type, url, index,fileType) {
      this.images.url = url
    },
  },

}

HTML部分：

上传前效果图：

上传过程效果图：

上传完毕效果图：