setState 的值传递给函数，直到第二个 onPress答案

【问题标题】：value of setState passed to function until second onPresssetState 的值传递给函数，直到第二个 onPress
【发布时间】：2018-09-11 04:02:48
【问题描述】：

我希望实现这些按钮以运行相同的功能但 query 的不同值，现在它正在工作但参数未传递给 searchfunc 函数：

  searchfunc = () => {

  const { query } = this.state;
  let url = "http://url/api/?q=" + query
  Keyboard.dismiss()

  fetch(url)
    .then((response) => response.json())
    .then((responseJson) => {
      this.setState({
        data: responseJson.results,
      });
    })
};

我的代码如下所示：

<TouchableOpacity
onPress={() => {
    this.setState({query: 'donut'});
    this.searchfunc();          }}
>
<Text>Donuts</Text>
</TouchableOpacity>

在第二次 onPress 上，我得到了我期待的甜甜圈结果。有人可以帮忙吗？

【问题讨论】：

标签： javascript react-native jsx

【解决方案1】：

在应用状态修改（即{query:'donut'}）后触发的setStatemethod offers a callback。

您可以使用此回调来解决您的问题，方法是进行以下调整：

<TouchableOpacity onPress={ () => { 
    this.setState({query: 'donut'}, () => this.searchfunc());
}}>
    <Text>Donuts</Text>
</TouchableOpacity>

这将导致this.searchfunc() 在this.setState({query:'donut'} .. 状态更改生效后被调用。

【讨论】：

【解决方案2】：

我建议您应该将查询作为函数参数传递，而不是将其保持在状态中。由于setState 异步工作并进行批量更新。因此，在进行 api 调用时，查询的状态可能不是最新的。

【讨论】：