开门见山,话不多说,要在表格中添加图片,可以使用td:
<table class="table-style" border="1" width="100%"> <tr class="tr-style first-style-thetd" > <td>巡查时间</td> <td>巡查人</td> <td>巡查地点</td> <td>点击查看详情</td> </tr> <tr v-for="columns1 in data1" class="tr-style tr-style-even second-style-thetd"> <td>{{columns1.col1}}</td> <td>{{columns1.col2}}</td> <td>{{columns1.col4}}</td> <td class="last-td"> <img class="img-cur" src="../../../../assets/images/mapicon.png" alt="查看" @click="menu2('/')"> </td> </tr>
</table>
而且准确、简单。
如果想要在iview的table中添加图片,也肯定是可以的,简单的使用代码如下:
{
title: '点击查看详情',
key: 'options',
align: 'center',
width: 110,
render: (h) => {
return h('img', {
attrs: {
src: '../../../../assets/images/mapicon.png',
},
style: {
marginRight: '5px'
},
on: {
click: () => {
this.menu2('/');
}
}
});
}
}
需要注意的是:
这里的图片地址用的是attrs而不是props。