表格插入值：slot-scope=“scope“和slot-scope=“{ row }“

最新推荐文章于 2024-03-19 15:48:41 发布

Igiveufireworks

最新推荐文章于 2024-03-19 15:48:41 发布

阅读量1.2k

点赞数 1

文章标签： vue.js elementui 前端

本文链接：https://blog.csdn.net/igiveufireworks/article/details/126170930

版权

"这篇博客介绍了在 Vue.js 的 `<el-table>` 组件中，如何利用 `slot-scope` 属性来动态渲染表格内容。通过 `scope.row` 或者直接 `slot-scope="{row}

摘要由CSDN通过智能技术生成

当在<el-table>标签上绑定:data的时候,可以使用：slot-scope="{ row }" ，或者用slot-scope="scope"配合scope.row来得到一整行的数据。例如：

<el-table-column min-width="120" label="待办">
    <template slot-scope="{row}">
        <span v-if="row.agency === 'success'">通过</span>
        <span v-if="row.agency === 'wait'">等待/span>
    </template>
</el-table-column>
<!-- 或者是： -->
<el-table-column min-width="120" label="待办">
    <template slot-scope="scope">
        <span v-if="scope.row.agency === 'success'">通过</span>
        <span v-if="scope.row.agency === 'wait'">等待/span>
    </template>
</el-table-column>