Question

假设我有这个组件，它将定期从API提取所有数据。

//在父组件上

constructor(props) {
  super(props);
  this.state = {
    datas: [],
  }
  this.apiCall = this.apiCall.bind.this
}

apiCall(){
  //fetch data here
  this.setState({
    datas: //result from fetch
  })
}

ComponentDidMount(){
  this.interval = setInterval(() => this.apiCall(), 10000);
}

handleEditData(){
  //api call, edit one data in server using POST
}

...
<ChildComponent onEdit={this.handleEdit}/>

子组件编辑数据时该怎么办？还是应该在handleEditData中放什么？

我应该通过发送POST到api编辑一个数据，然后使用handleEdit中的setState手动更新本地状态吗？
还是我应该发送POST到api，然后调用apiCall函数以获取新数据，这些数据会更改其状态并重新呈现？

谢谢

Answer 1

这是一个有趣的问题，它不是涉及响应的问题，而更多是资源管理问题。要问的问题是数据在做什么。如果您有需要记录的数据，则应使用API存储数据。如果要在您的应用程序中重复使用数据并且您已经拥有它，为什么不就地使用它呢？它减少了您的通话（从而使应用程序更高效），并且在此过程中减少了一个破损点。

要重申：在设计系统时，应先局部看一下，然后再使用更多的活动部件。我只是将数据冒泡并将setState与本地对象一起使用。

Answer 2

有时，客户端网络连接将会丢失，并且如果您在发送请求之前或在接收到服务器的失败响应之后在客户端更新了数据，因为后端不会进行更新！！！刷新浏览器后，使用者将看到尚未更新的数据。

因此，我建议您在收到服务器的成功响应后更新数据。

Answer 3

首先，您应该调用api以使用POST在服务器中编辑一个数据，并在此api响应成功后就可以设置状态

api调用后更新组件的正确方法是什么

3 个答案: