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}