微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何保证数据不变时Material Table不更新,数据变化时不取消用户交互?

如何解决如何保证数据不变时Material Table不更新,数据变化时不取消用户交互?

我有一个反应组件,它的状态每秒更新一次。这并不是说数据每秒都在变化,只是我有一个后端进程在运行,它每秒向我的前端发送一个数据对象,无论对象是否发生变化。如果对象没有改变,react 会做它的事情并且不会重新绘制所有东西,但是我将这个对象传递给一个材料表,所以材料表也会得到“ping”。通常这会很好——因为数据没有改变,表不应该更新但是材料表本身改变了它传递的数据,所以每次我传递它我的数据对象它认为对象已经改变(因为它不是' t 与手头上的相同)并重新渲染表格。这会关闭用户已打开的所有交互,因此如果他们正在编辑某些内容,那么在后端与数据接触的每一秒中,编辑都会被取消。

screenshot of data compare from material table

底部控制台的截图中可以看出,我传入的数据(不包括tableData),右侧我显示了prevProps的定义(材料表本地状态之前的表数据)到此更新),这与我传入的数据相同,但添加了 tableData 对象(这是库对数据道具所做的更改)。因此,第 688 行总是返回“真”,迫使 691 到 695 触发重新渲染表和重新设置表数据,这会触发表数据重新渲染并关闭用户在做中。

我如何确保材料表理解我的数据没有改变,尽管他们改变了我发送给他们的原始数据?

即使如此,如果数据已经发生变化,我希望不会取消交互(例如删除、编辑、添加或面板下拉菜单)。这些交互似乎是在材料表添加到我的数据对象的 tableData 对象中定义的,所以我需要以某种方式掌握它们的更改,并将它们与我的数据对象混合在一起,以便我可以保持它们的状态(并传递它们他们已经拥有的东西,所以他们认为我不会一直在做更新)-- 任何关于如何做到这一点的建议将不胜感激!

我唯一能想到的就是添加一个“shouldComponentUpdate”,对旧数据和传入数据进行比较,如果它们相同,则停止对渲染方法调用,以便 MaterialTable 永远不必考虑任何事情,但是当由于实际数据更改而进行合法的重新渲染时,这仍然会触发所有用户交互被取消。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。