反应本土国家

Question

我在构造函数中声明了一个状态，并尝试从

renderScene

调用它，但是

this.state

始终是

null

有什么问题吗？

我的代码是；

var _ = require('underscore');
class ReactNotes extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedNote: { title: "", body: "" },
      notes: {
        1: { title: "Note 1", body: "body", id: 1 },
        2: { title: "Note 2", body: "body", id: 2 }
      }
    };
  } 
  render() {
    return (
      <Navigator initialRoute={{ name: 'home' }}
        renderScene={this.renderScene}
        navigationBar=
        {
          <Navigator.NavigationBar
            routeMapper={NavigationBarRouteMapper}
            style={styles.navBar}
          />
        }
      />);
  }

  renderScene(route, navigator) {
    switch (route.name) {
      case 'home':
        return (
          <HomeScreen navigator={navigator} notes={_(this.state.notes).toArray()} onSelectNote={(note) => navigator.push({ name: "createNote", note: note })} />
        );
      case 'createNote':
        return (
          <NoteScreen note={this.state.selectedNote}
            onChangeNote={(note) => this.updateNote(note)} />
        );
    }
  }
}

输出如下：

Answer 1

您可以将您的函数与箭头函数绑定

renderScene = (route, navigator) => {
  //...
}
//then call your function in your navigator as  
renderScene={this.renderScene}

或

// You can use bind() to preserve `this`
renderScene={this.renderScene.bind(this)}>

// Or you can use arrow function this way
renderScene={() => this.renderScene()}>