vue img+element-ui的image图片组件实现预览

 <div class="demo-image__preview" v-show="isShow" style="display:block;">
          <img style="width: 100px; height: 100px" :src="file.filePath" title="点击查看大图" @dblclick="look"></img>
           <el-image-viewer v-if="showViewer"  :on-close="closeViewer" :url-list="srcList"/>
        </div>
import ElImageViewer from "element-ui/packages/image/src/image-viewer";

components: { ElImageViewer },


  srcList:[],
      showViewer:false

 closeViewer(){this.showViewer=false;},
    look(){
      console.log(1)
      this.showViewer=true;
      console.log(this.showViewer)
      this.srcList[0]=this.file.filePath
      console.log(this.srcList[0])
    },

 

posted @ 2020-03-12 17:21  学习就是进步!  阅读(7791)  评论(0)    收藏  举报