2016-08-15 11 views
0

反応コンポーネントでは、propsは受信されますが、propsの値は未定義です。なぜ反応するのですか?

私のコンポーネントは、この

class NavRoot extends Component { 
    constructor (props) { 
     super(props) 

     this._handleNavigate = this._handleNavigate.bind(this) 
    } 

    _renderScene (props) { 
     const { route } = props.scene 
     if (route.key == 'home') { 
      // here is the problem: In Home component, props received Object {_handleNavigate: undefined} 
      return <Home _handleNavigate={this._handleNavigate} /> 
     } 
    } 

    // handle navigation between scene 
    _handleNavigate (action) { 
     switch (action && action.type) { 
      case 'push': 
       this.props.pushRoute(action.route) 
       return true; 
      case 'back': 
      case 'pop': 
       return this._handleBackAction() 
      default: 
       return false; 
     } 
    } 

    render() { 
     return (
      <NavigationCardStack 
       style={{flex: 1}} 
       navigationState={this.props.navigation} 
       onNavigateBack={this._handleBackAction} 
       renderScene={this._renderScene} /> 
     ) 
    } 
} 

function mapStateToProps (state) { 
    return { 
     navigation: state.navReducer 
    } 
} 

export default connect(
    mapStateToProps, 
    { 
     pushRoute: (route) => push(route), 
     popRoute:() => pop() 
    } 
)(NavRoot) 

のように見え、これはホームのコンポーネントは次のようになります。私はボタンをクリックすると

class Home extends Component { 
    constructor(props) { 
     super(props); 
    } 
    render() { 
    return (
    <View style={styles.container}> 
     <Text style={styles.title}>Home</Text> 
     <Button onPress={this.props._handleNavigate(route)} label='Go to About' /> 
    </View> 
    ) 
    } 
} 

、それは_handleNavigateが定義されていない報告します。

constructor (props) { 
     super(props) 

     this._handleNavigate = this._handleNavigate.bind(this) 
     this. _renderScene = this. _renderScene.bind(this); 
    } 

_renderSceneのコンテキストがNAVROOTの文脈ではないので:ホームコンポーネントで は、小道具は、あなたのコンストラクタ関数を変更してくださいObject {_handleNavigate: undefined}

答えて

関連する問題