关于前端:elementui-table表单-插入新的elementui标签-新标签获取表单属性值

38次阅读

共计 542 个字符，预计需要花费 2 分钟才能阅读完成。

我在应用饿了么表单时，想在表单外面插入一个图片作为表单信息头像，发现图片标签没方法获取到表单的属性，我一开始是这样写的：

<el-table :data="tableData">
    <el-table-column prop=""label=" 头像 "width="180">
        <el-avatar :src="url"></el-avatar>
    </el-table-column>
</el-table>

而我的数据是这样的：

data() {
    return {
      tableData: [
            {
                name: "西红柿",
                url: "./image/xhs.png"
            },
            {
                name: "南瓜",
                url: "./image/ng.png"
            },
      ],
    }
};

我写完之后，发现基本就不能获取到 url

解决办法：

<el-table-column prop=""label=" 头像 "width="180">
    <template slot-scope="scope">
        <el-avatar :src="scope.row.url"></el-avatar>
    </template>
</el-table-column>

应用了 template 标签之后，能够应用 slot-scope 获取到 table 以后行的数据，再通过 scope.row.url 赋值给 src 就能够了

正文完