问题的解决方法是在Antdesign的表格组件上设置“key”属性。 Antdesign表格组件在进行重新呈现时,会根据“key”属性来判断是否需要重新渲染。
以下是代码示例:
import React, { useState } from 'react';
import { Table } from 'antd';
const App = () => {
const [dataSource, setDataSource] = useState([
{ key: '1', name: 'Mike', age: 32 },
{ key: '2', name: 'John', age: 42 },
]);
const [columns, setColumns] = useState([
{
title: 'Name',
dataIndex: 'name',
key: 'name',
},
{
title: 'Age',
dataIndex: 'age',
key: 'age',
},
]);
const changeDataSource = () => {
setDataSource([
{ key: '1', name: 'Mike', age: 32 },
{ key: '2', name: 'John', age: 25 }, // 更新列表第二个元素的年龄值
]);
};
return (
<>
>
);
};
export default App;