Question

我认为问这个问题可能很愚蠢，但请相信我，我一直难以找到答案。实际上，我正在尝试在render函数之上的类函数中访问更新后的状态值，但是我没有得到更新后的值。当我在render函数中控制台值时，我得到了更新的值。有人可以帮我如何获取更新的价值。

谢谢

代码

fetchAgents = e => {
  this.setState({
    value: e.target.value
  });
};

fetchFilteredInventories = e => {
  axios
    .get(`/api/reports/agents/?branch=${this.state.value}`)
    .then(response => {
      this.setState({
        agents: response.data
      });
    });
};

当我尝试访问fetchFilteredInventories中的更新状态值时，我得到的是null值。有人可以帮助我实现我的目标

Answer 1

setState是异步的。在setState之后使用console.log时，状态尚未更改，它正在更改过程中。试试这个

this.setState({
 value : e.target.value
 },()=>console.log(value));

您将看到该值已更新。 setState允许使用回调函数作为争论。因此，请使用回调函数来使用更新后的状态值。

阅读文档以获取更多信息：https://reactjs.org/docs/state-and-lifecycle.html#using-state-correctly

Answer 2

这取决于您在哪里调用fetchFilteredInventories函数。
在React组件中进行状态更新后，将调用某些生命周期挂钩，例如componentWillUpdate，componentDidUpdate。您可以在State and Lifecycle的React文档中阅读有关它们的信息。
请确保在适当的时候调用API调用函数。
如果可以，请将整个组件代码放在此处以获得更好的答案

Answer 3

尝试This

axios.get(`/api/reports/agents/?branch=${this.state.value}`).then(function(response) {
       this.setState({
            agents: response.data
          });
    }.bind(this));

如何使用渲染功能上方的更新状态值？

3 个答案: