React Native 和 Drawer :undefined 不是对象导航器

Question

我想用抽屉(原生底座(设置一个侧边栏菜单。

我有一个应用程序.js ：

export default class ReactProject extends Component {
 renderScene (route, navigator) {
  return <route.component navigator={navigator} />
}
render() {
  return (
  <Navigator
  style={styles.container}
  renderScene={this.renderScene.bind(this)}
  initialRoute={{component: Home}}  
  />
  );
}
}

带抽屉的家.js：

export default class Home extends Component {
    render() {   
    return (
      <Drawer
        ref={(ref) => { this._drawer = ref; }}
        content={<SideBar />} navigator={this.props.navigator}>
        <Container>
        </Container>
      </Drawer>
    );
}
}

和侧边栏.js加载到抽屉中：

export default class SideBar extends Component {
constructor(props) {
    super(props);
}
redirect(routeName){
    this.props.navigator.push({
      component: routeName
    });
  }
  render() {
    return (
      <Content style={styles.sidebar}>
          <ListItem button >
            <Text>Home</Text>
          </ListItem>
          <ListItem button >
            <Text>Test</Text>
          </ListItem>
           <ListItem button onPress={this.redirect.bind('Blank')}>
            <Text>Blank Page</Text>
          </ListItem>
      </Content>
    );
  }
}

但是当我单击时，我有此错误：

Undefined不是一个对象(评估'this.props.navigator.push'(

当按钮在页面中但仅在侧边栏中时，我没有这个问题.js

有人可以帮助我吗？

谢谢托马斯。

Answer 1

我认为您必须更改房屋的一点代码.js如下所述：

render() {   
return (
  <Drawer
    ref={(ref) => { this._drawer = ref; }}
    content={<SideBar navigator={this.props.navigator} />}
    <Container>
    </Container>
  </Drawer>
);

并在侧边栏.js文件中添加以下代码行：

  static propTypes = {
      navigator: React.PropTypes.object,
   }