Javascript setParams在回调函数上不起作用
要在屏幕中使用状态,我将从上一个屏幕发送回调函数作为道具 要在用户按下Javascript setParams在回调函数上不起作用,javascript,react-native,react-router,react-navigation,Javascript,React Native,React Router,React Navigation,要在屏幕中使用状态,我将从上一个屏幕发送回调函数作为道具 要在用户按下TagStyle标题上的“保存”按钮时调用onCheck,我将onCheck函数从屏幕A发送到TagStyle屏幕 _handleTagStylePress = () => { this.props.navigation.navigate('TagStyle', {onCheck: this.onCheck, selectedStyleIds: this.state.selectedStyleIds});
TagStyle
标题上的“保存”按钮时调用onCheck
,我将onCheck
函数从屏幕A发送到TagStyle
屏幕
_handleTagStylePress = () => {
this.props.navigation.navigate('TagStyle', {onCheck: this.onCheck, selectedStyleIds: this.state.selectedStyleIds});
}
屏幕A中定义的onCheck函数更改状态和navigation.state.params。在这里,我无法设置参数。我确认了this.props.navigation有setParams方法,但不知怎么的,它什么都没做
_setSelectedStyleIds = (selectedStyleIds) => {
console.log(selectedStyleIds); <- correctly printed [1,2,3,4,5]
const action = NavigationActions.setParams({ params: {selectedStyleIds},
key: 'id-1509842157447-6' });
this.props.navigation.dispatch(action); <- no params change at all
this.props.navigation.setParams({styleIds:selectedStyleIds}); <- no params change at all
this.setState({selectedStyleIds});
}
onCheck = ({selectedStyleIds}) => {
console.log(selectedStyleIds); <- correctly printed [1,2,3,4,5]
this._setSelectedStyleIds(selectedStyleIds);
console.log(this.props); <- result showing below
// navigation.state.params.selectedStyleIds: []
this.setState({selectedStyleIds}); <- setState is working
// state = {selectedStyleIds:[1,2,3,4,5]}
}
标签样式屏幕
static navigationOptions = ({ navigation }) => ({
headerRight: (
<RkButton
rkType='clear'
onPress={() => {
console.log(navigation.state.params.selectedStyleIds) <- [1,2,3,4,5]
navigation.state.params.onCheck({selectedStyleIds: navigation.state.params.selectedStyleIds});
navigation.goBack();
}}>
<RkText rkType="header3">SAVE</RkText>
</RkButton>
),
})
静态导航选项=({navigation})=>({
头灯:(
{
console.log(navigation.state.params.SelectedStyleId)
拯救
),
})
我猜this.props.navigation.setParams不是在屏幕A中设置当前参数,而是在某个地方设置参数。我找不到如何进一步处理或调试此问题。有一种更可控的方法。您可以尝试以下方法吗
从'react navigation'导入{NavigationActions};
...
const setParamsAction=NavigationActions.setParams({
参数:{onCheck:/*您的函数*/},
键:“参数更改的路由”,
});
this.props.navigation.dispatch(setParamsAction);
有一种更可控的方法。您可以尝试以下方法吗
从'react navigation'导入{NavigationActions};
...
const setParamsAction=NavigationActions.setParams({
参数:{onCheck:/*您的函数*/},
键:“参数更改的路由”,
});
this.props.navigation.dispatch(setParamsAction);
这是程序包错误吗…??那么Frustraiting这是程序包错误吗…??那么Frustraiting我只是用你的建议编辑了问题,但它不起作用。你看到问题了吗?谢谢
static navigationOptions = ({ navigation }) => ({
headerRight: (
<RkButton
rkType='clear'
onPress={() => {
console.log(navigation.state.params.selectedStyleIds) <- [1,2,3,4,5]
navigation.state.params.onCheck({selectedStyleIds: navigation.state.params.selectedStyleIds});
navigation.goBack();
}}>
<RkText rkType="header3">SAVE</RkText>
</RkButton>
),
})