标签：span 渲染 版本 路径 取数据 行数据 images 百度 怎么
是这样的,页面是商品列表
使用了element-ui 中的 el-table
正常渲染是没问题的,可是我需要显示商品图片,这就需要先获取到每个商品对象的图片路径,但是看element文档没有说怎么获取数据的,只是能够在列中使用prop
经过百度,知道了vue的插槽,代码如下
<el-table :data="goods" stripe border style="width: 100%"> <el-table-column prop="name" label="名称" width="180"></el-table-column> <el-table-column label="图片" width="50"> <template v-slot="shuju"> <el-image :src="‘/static/images/food/‘+shuju.row.img"></el-image> </template> </el-table-column> <el-table-column prop="typeid" label="typeid" width="100"></el-table-column> <el-table-column prop="price" label="单价" width="100"></el-table-column> <el-table-column prop="xiaoliang" label="销量" width="50"></el-table-column> <el-table-column label="操作"></el-table-column> </el-table>
图片列中,使用了插槽,原先是slot-scope,貌似新版本打算弃用,使用了v-slot "shuju"是随便写的名字,只要里面调用就可以了 shuju.row 是获取的商品对象,shuju.row.img就是我需要的图片路径
vue vuecli element table 表格 获取行数据
标签：span 渲染 版本 路径 取数据 行数据 images 百度 怎么
原文地址：https://www.cnblogs.com/zonglonglong/p/12677010.html
