反应更新状态奇怪的行为

Question

我目前正在尝试通过子组件更新组件状态，但回调函数告诉我状态未更新。

方法（loadModuleContent）

export default class LayoutPage extends React.Component {
    constructor() {
        super();
        this.startSession = this.startSession.bind(this);
        this.loadModuleContent = this.loadModuleContent.bind(this);
        this.state = {
            content: undefined,
            group: undefined,
            title: undefined,
            selectionIndex: undefined
        }
    }

    static navigationOptions = {
        header: null
    };

    loadModuleContent(_content, _title, _selectedIndex) {
        console.log("Inserting index: " + _selectedIndex);
        this.setState({
            content: _content,
            title: _title,
            selectionIndex: _selectedIndex
        }, console.log("State updated:" + this.state.selectionIndex));
    }
...

控制台日志

Answer 1

您未在callback来电中使用setState。您没有传递回调，而是传递一个方法调用，该方法调用会立即进行评估。将您的setState更改为此

  this.setState({
      content: _content,
      title: _title,
      selectionIndex: _selectedIndex
  }, () => console.log("State updated:" + this.state.selectionIndex));

如果你不使用ES06，你已经在第二个参数中写出了这个功能。