table表格点击文字查看图片

1.引入elementUI组件 并且注册，使用
 import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
 components: { ElImageViewer },
   <el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="[...url]" />
2.页面
 <el-table-column prop="costItemRemarks" label="农事照片" width="200">
                <template slot-scope="scope">
                    <div>
                        <el-link type="primary" @click="lookIamge(scope.row)">查看图片</el-link>
                 
                    </div>

                </template>
            </el-table-column>
//data中要定义的变量
  url: [],
                showViewer: false,
//点击文查看
    lookIamge(row) {
                this.url = [];
                this.url.push(row.picture)
                this.showViewer = true;
            
            },
  // 关闭查看
            closeViewer() {
                this.url = []
                this.showViewer = false
            },