React Table dataSource 更新,Table未重新渲染

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)
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值