el-table 0正常 1不正常
时间: 2023-08-01 13:12:59 浏览: 47
根据您提供的信息,我理解您想知道如何在 el-table 中显示 "0" 和 "1" 的值为 "正常" 和 "不正常"。您可以使用插槽和计算属性来实现这个功能。
首先,您可以在 el-table-column 中使用插槽来自定义字段的显示。然后,您可以创建一个计算属性来根据字段的值返回相应的文本。
下面是一个示例:
```html
<el-table :data="tableData">
<el-table-column label="状态">
<template slot-scope="scope">
<!-- 使用计算属性来返回相应的文本 -->
<span>{{ getStatusText(scope.row.status) }}</span>
</template>
</el-table-column>
</el-table>
```
在上面的示例中,我们使用了 `getStatusText` 计算属性来根据 `status` 字段的值返回相应的文本。
```javascript
data() {
return {
tableData: [
{ name: 'John', status: 0 },
{ name: 'Jane', status: 1 },
// 其他数据...
]
}
},
methods: {
getStatusText(status) {
return status === 0 ? '正常' : '不正常';
}
}
```
在上面的示例中,我们将 `tableData` 数组中的每个对象都包含了 `name` 和 `status` 字段。通过调用 `getStatusText` 方法,我们可以根据 `status` 的值返回相应的文本。
这样,当 `status` 的值为 0 时,显示为 "正常",当 `status` 的值为 1 时,显示为 "不正常"。您可以根据实际的需求和数据结构进行相应的调整。
相关推荐
![7z](https://img-home.csdnimg.cn/images/20210720083312.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![7z](https://img-home.csdnimg.cn/images/20210720083312.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)