element图片

插入子组件

  <i  @click="viewAccessory(item.img)"></i>  //图片路径
<el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="[url]" />

引入子组件并使用

import ElImageViewer from "element-ui/packages/image/src/image-viewer";
export default {
components: {
     ElImageViewer
},
data() {
        return {
            showViewer: false, // 显示查看器
            url: ""
        };
    },
  methods: {
        //关闭图片
        closeViewer() {
            this.showViewer = false;
        },
        /**
         * 查看图片
         */
        viewAccessory(img) {
            this.showViewer = true;
            this.url = img;
        }
    }