const [tableData,settableData]=useState(Array)
const columns=[
...
]
let change=(value)=>{
//*
let tabledata=tableData
tabledata.push(value)
settableData(tabledata)
...
}
...
return(
<Table
columns={columns}
dataSource={tableData}
/>)
打了*号的这个写法,虽然把tableDta取出,然后直接push,但其实所指向的都是一个地址,因此这只改变了这个地址指向的内存数据。
但就是因为指向了一个地址,React认为虚拟DOM并没有改变,因此,不会重新渲染页面。这就会导致Table组件的dataSource改变了,但是Table并没有重新渲染。
解决方法
数据需要处理时
let change=(value)=>{
let tabledata=[]
tableData.forEach(element=>{
//处理步骤,比如给某一项加一或者减一之类的处理
...
tabledata.push(element)
})
//处理步骤
...
tabledata.push(value)
settableData(tabledata)
...
}
不需要处理时
创建一个新数组,赋值
let change=(value)=>{
const obj = value
tableData.push(value)
settableData(tabledata)
}