javascript - react native 中的分段控件在事件和我的状态中不包含相同的值

Question

我对 React Native 中的 SegmentedControl 组件有疑问。

<SegmentedControlIOS style={styles.SegmentedControlIOS}
    values={['All', 'Recent']}
    selectedIndex={this.state.selectedIndex}
    onChange={this._handleChangeSegment.bind(this)}
/>

_handleChangeSegment(event) {
    console.log(event.nativeEvent.selectedSegmentIndex, "nativeEvent");
    this.setState({
        isLoading: true,
        selectedIndex: event.nativeEvent.selectedSegmentIndex
    });
    console.log(this.state.selectedIndex, "state");
    this.fetchData();
}

这里的问题是 nativeEvent.selectedSegmentIndex 的值和我的 selectedIndex 状态，在我的控制台中：

默认情况下 selectedIndex 状态在构造函数中设置为 1（最近）。
当我单击“全部”时，console.log 返回

0, 'nativeEvent'
1, '状态'

所以 nativeEvent 是正确的，但在我的状态下似乎没有更新，我不知道为什么。
你能帮我吗？

在 fetchData 方法中，我检查 selectedIndex 状态是 1 还是 0 来调用 ajax 请求，但它不会加载好的请求，因为状态值不是 nativeEvent.selectedSegmentedIndex。

问候。

Answer 1

From https://facebook.github.io/react/docs/component-api.html

setState() does not immediately mutate this.state but creates a pending state transition. Accessing this.state after calling this method can potentially return the existing value.

Therefore, console.log(this.state.selectedIndex, "state") is not necessarily going to return the mutated state.

If you need access to the mutated state, you can pass a callback function as a second argument to setState - this callback function will be executed after the state has been mutated.