setParams在回調函數中不起作用

Question

要在Screen中使用狀態，我要從前一個屏幕發送回調函數作爲道具。

要呼叫onCheck當用戶按下「保存」上在TagStyle頭按鈕，我從屏幕在畫面A定義的

_handleTagStylePress =() => { 
    this.props.navigation.navigate('TagStyle', {onCheck: this.onCheck, selectedStyleIds: this.state.selectedStyleIds}); 
    } 

的oncheck功能發送onCheck功能TagStyle屏幕更改狀態和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]} 
    } 

console.log（this.props）;打印

Object { 
    "dispatch": [Function anonymous], 
    "navigation": Object { 
    "dispatch": [Function anonymous], 
    "goBack": [Function goBack], 
    "navigate": [Function navigate], 
    "setParams": [Function setParams], 
    "state": Object { 
     "key": "id-1509771947484-6", 
     "params": Object { 
     "bigType": "Top", 
     ... 
     ... 
     ... 
     "selectedStyleIds": Array [], 
     ... 
     }, 
     "routeName": "AddClotho", 
    }, 
    }, 
    "screenProps": undefined, 
} 

TagStyle屏幕

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> 
    ), 
    }) 

我猜this.props.navigation.setParams被設置在屏幕一個不是當前PARAMS但PARAMS地方。我無法找到如何進一步處理或調試此問題。

Answer 1

有一個更受控制的方法。你可以嘗試以下嗎？

import { NavigationActions } from 'react-navigation'; 
 

 
... 
 

 
const setParamsAction = NavigationActions.setParams({ 
 
    params: { onCheck: /* YOUR FUNCTION */ }, 
 
    key: 'ROUTE FOR PARAM CHANGE', 
 
}); 
 

 
this.props.navigation.dispatch(setParamsAction);