后端返回字典数据:const dict = [ {code:1,value:'适用对象1'}, {code:2,value:'适用对象2'} ]; 使用ant design columns computed customrendery实现列表中显示对应的字典中文
时间: 2024-02-16 19:03:48 浏览: 20
假设你要在 Ant Design Table 中显示 `value` 字段,可以使用 `columns` 中的 `render` 函数来实现。具体做法如下:
1. 在 `columns` 中添加一列,指定该列的 `dataIndex` 和 `title`,例如:
```
const columns = [
{
title: '适用对象',
dataIndex: 'code',
render: (text, record) => {
// TODO: 在这里实现根据 code 获取对应的 value
return record.value;
},
},
// 其他列...
];
```
2. 在 `render` 函数中,根据 `record.code` 查找字典中对应的 `value`,并返回。可以使用 `find` 函数或者 `for` 循环实现,例如:
```
render: (text, record) => {
const dict = [
{ code: 1, value: '适用对象1' },
{ code: 2, value: '适用对象2' },
];
const item = dict.find((item) => item.code === record.code);
return item ? item.value : '-';
},
```
这样就可以根据字典中的 `code` 在列表中显示对应的中文了。注意,如果字典中不存在对应的 `code`,可以返回一个默认值,例如 `'-'`。