如何解决使用setState后,React Component UI不更新
我有两个按钮单击,下一步和上一个。 当我单击“下一步”时,我将从API响应并更新状态和UI。
当我单击Prev时,我正在从本地数组获取记录并更新状态,但UI未更新
import React,{ Component } from "react";
import axios from "axios";
class Foo extends Component {
currentRecords=[];
prevRecordsList = [];
constructor(props) {
super(props);
this.onNextClick=this.onNextClick.bind(this);
this.onPrevClick=this.onPrevClick.bind(this);
this.state={
tableData=[],};
onNextClick(){
axios.post(url,postdata).then(res=>{
this.setState({
tableData:res.data
});
var prev=currentRecords.pop(); //Initially,this array having first set of data
prevRecordsList.push(prev);
currentRecords.push(res.data)
}
onPrevClick(){
var prevRecords=prevRecordsList.pop();
this.setState({
tableData:prevRecords
});
}
解决方法
我时不时有类似的事情发生……在我的案例中,问题是我还调用了setState,但该状态下的先前数据几乎与我设置的数据完全相同,这就是为什么我组件不想再次渲染。
也许尝试将setState设置为空数组或其他内容,然后再执行适当的setState
如果有更好的解决方案,我会很高兴听到它
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。