我在课堂上有一个方法,当我按导航选项中的按钮时,我需要访问该方法。
我在GitHub反应原生问题后遵循了这种方法。 Github
static navigationOptions = ({ navigation }) => ({
title: i18n.t('viewben'),
header: ({ state }) => ({
right: <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
<TouchableHighlight onPress={() => {
navigation.navigate('home');
}}>
<Image style={{ marginRight: 20 }} source={require('../../../resources/toolbar/home_white.png')} />
</TouchableHighlight>
<TouchableHighlight >
<Image style={{ marginRight: 10 }} source={require('../../../resources/toolbar/edit_white.png')} />
</TouchableHighlight>
<TouchableHighlight onPress={state.params.handleDelete()}>
<Image style={{ marginRight: 10 }} source={require('../../../resources/toolbar/delete_white.png')} />
</TouchableHighlight>
</View>,
}),
headerTintColor: 'white',
headerStyle: {
backgroundColor: colors.themeColor,
// top: 30
}
});
_deleteBen() {
Alert.alert(i18N.t('delBen'), i18N.t('sureben'), [
{
text: i18N.t('confirm'), onPress: () => {
}
},
{ text: i18N.t('canc'), onPress: () => { }, style: 'cancel' },
], { cancelable: false });
};
componentDidMount() {
this.props.navigation.setParams({
handleDelete: this._deleteBen
});
}
呈现代码
render() {
return (
<View style={styles.mainWrapper} >
<ScrollView>
<Text style={styles.headerText}>{i18n.t('bendetails')} </Text>
{/* <Text style={styles.headerAccNo}>{this.state.stViewAccountNo}</Text> */}
<FlatList style={styles.flatList} data={this.state.stAccntDetail} renderItem={this._renderList} />
<View style={styles.emptyContainer}>
</View>
</ScrollView>
<TouchableOpacity >
<Image style={{ marginTop: 10, height: 50, alignSelf: 'center', marginRight: 10 }} source={require('../../../resources/toolbar/edit_white.png')} />
<Text >edit</Text>
</TouchableOpacity>
<TouchableOpacity onPress={() => this._deleteBen()} >
<Text >delete</Text>
<Image style={{ marginTop: 10, height: 50, alignSelf: 'center', marginRight: 10 }} source={require('../../../resources/toolbar/delete_white.png')} />
</TouchableOpacity>
</View>
);
}
}
我收到的错误就像无法访问未定义的'Params'一样。请让我知道我哪里出错了。我也包含了渲染代码。
答案 0 :(得分:0)
这是因为您在handleDelete
navigationOptions
make和箭头功能,如下所示:
<TouchableHighlight
onPress={() => state.params.handleDelete()}
>
此外,您应该将_deleteBen
方法与this
上下文绑定。
componentDidMount() {
this.props.navigation.setParams({
handleDelete: this._deleteBen.bind(this)
});
}