Question

要在屏幕中使用状态，我将回调函数作为前一个屏幕的道具发送。

当用户按下function process(arr) { return arr.reduce((map, o) => { const product = o.Product; if (!map[product]) { map[product] = { min: null, max: null}; } const prop = o.MustBe === 'Greater than' ? 'min' : 'max'; map[product][prop] = o.Value; return map; }, {}); } console.log(process([{ Level: "District", Product: "Duplacor", MustBe: "Less Than", Value: 50000 }, { Level: "District", Product: "Amcor", MustBe: "Less Than", Value: 100000 }, { Level: "District", Product: "Juxtiva", MustBe: "Greater than", Value: 500000 }, { Level: "District", Product: "Juxtiva", MustBe: "Less than", Value: 1500000 }, { Level: "District", Product: "Amcor", MustBe: "Greater than", Value: 50000 }]));标题上的“保存”按钮时，要致电onCheck，我会将TagStyle功能从屏幕发送到onCheck屏幕A

TagStyle

屏幕A中定义的

onCheck功能更改状态和navigation.state.params。在这里我不能设置帕拉姆斯。我确认了this.props.navigation有setParams方法，但不知怎的，它没有做任何事情。

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

的console.log（this.props）;打印

  _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]}
  }

TagStyle屏幕

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

我猜这个.props.navigation.setParams在屏幕A中设置NOT current 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);

setParams不能处理回调函数

1 个答案: