iView の Table
を使って、画像を表示しようとして、やり方がドキュメントになかったので、メモしたい
ソース
<template>
<div>
<Table :columns="columns" :data="tokens"></Table>
</div>
</template>
<script>
export default {
data () {
return {
columns: [
{
title: 'Name',
key: 'name',
render: (h, params) => {
return h('div', [
h('img', { attrs: { src: require(`../../images/${params.row.icon}`) } }),
])
}
},
]
};
},
};
</script>
ハマったポイント
-
img
のsrc
を指定したいが、props
ではできず、attrs
を使うとできました -
img
のパスですが、該当ファイルからの相対パスだけでは画面上に表示できず、require(...)
を入れるとできました。