element ui表格怎么写三目
时间: 2023-07-05 20:27:44 浏览: 106
你可以在 Element UI 表格的列定义中使用 `scoped-slot` 的方式来实现三目运算。
例如,假设你的数据中有一个 `status` 字段,它的值可能是 `0` 或 `1`,你想要根据不同的值展示不同的内容。你可以这样写:
```html
<template>
<el-table :data="tableData">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="status" label="状态">
<template slot-scope="scope">
<span v-if="scope.row.status === 0">未发布</span>
<span v-else-if="scope.row.status === 1">已发布</span>
<span v-else>未知状态</span>
</template>
</el-table-column>
</el-table>
</template>
```
在这个例子中,我们使用了 `scoped-slot` 的方式来定义了一个匿名插槽,并使用 `slot-scope` 属性传递了一个名为 `scope` 的对象。在这个插槽中,我们根据 `scope.row.status` 的不同值来展示不同的内容。
如果 `status` 的值为 `0`,则展示 `未发布`,如果值为 `1`,则展示 `已发布`,否则展示 `未知状态`。
阅读全文