本人在做vue 新项目时在动态数据渲染的el-table 中添加图片展示
具体代码
<el-table-column
:key="index"
v-for="(item,index) in maptabletitle.filter(e=>e.item_key!='status'&&e.item_key!='is_sync')"
:label="item.item_name"
:prop="item.item_key"
>
<template slot-scope="scope">
<img :src="scope.row[item.item_key]" width="127" height="70" v-if="item.item_key=='image_src'"/>
<span v-else>{{scope.row[item.item_key]}}</span>
</template>
</el-table-column>
在循环遍历的时候对数据源的字段进行筛选，返回的是进行筛选之后的结果集
maptabletitle.filter(e=>e.item_key!='status'&&e.item_key!='is_sync')
自定义结构
<template slot-scope="scope">
<img :src="scope.row[item.item_key]" width="127" height="70" v-if="item.item_key=='image_src'"/>
<span v-else>{{scope.row[item.item_key]}}</span>
</template>
这里是所有的结果集，所以要结合v-if和v-else使用
