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])
    },