反应导航，调度动作改变场景 - 场景不显示

Question

我在下面设置了我的子步骤导航器，第一个场景 PCDrinkingDays 工作正常。然而，当我点击调度一个动作时，从那个组件改变场景：

 onDone = () => {
    this.props.dispatch(navigate(scenes.PC_HELP_ME_CALCULATE));
  };`

PCHelpMeCalculate 没有出现，虽然我可以通过设置断点看到它在后台呈现。

我的导航器在下面。其他场景似乎没问题，它只是从第一个场景开始移动，这似乎是问题所在。谁能帮忙？为什么组件不显示？

import { SubStepsNavigator } from '../../../navigators';

import PCDrinkingDays from '../PCDrinkingDays';
import PCHelpMeCalculate from '../PCHelpMeCalculate';
import PCUnitsCalculatorWhat from '../PCUnitsCalculatorWhat';
import PCUnitsCalculatorSize from '../PCUnitsCalculatorSize';
import PCUnitsCalculatorStrength from '../PCUnitsCalculatorStrength';
import PCUnitsCalculatorDrinksNumber from '../PCUnitsCalculatorDrinksNumber';
import PCUnitsCalculatorTable from '../PCUnitsCalculatorTable';

import * as scenes from '../../../scenes';

const PCDrinkingScenes = {
  [scenes.PC_DRINKING_DAYS]: { screen: PCDrinkingDays },
  [scenes.PC_HELP_ME_CALCULATE]: { screen: PCHelpMeCalculate },
  [scenes.PC_UNITS_CALCULATOR_WHAT]: { screen: PCUnitsCalculatorWhat },
  [scenes.PC_UNITS_CALCULATOR_SIZE]: { screen: PCUnitsCalculatorSize },
  [scenes.PC_UNITS_CALCULATOR_STRENGTH]: { screen: PCUnitsCalculatorStrength },
  [scenes.PC_UNITS_CALCULATOR_DRINKS_NUMBER]: {
    screen: PCUnitsCalculatorDrinksNumber,
  },
  [scenes.PC_UNITS_CALCULATOR_TABLE]: { screen: PCUnitsCalculatorTable },
};

function getStep(routeName) {
  switch (routeName) {
    case scenes.PC_DRINKING_DAYS:
    case scenes.PC_HELP_ME_CALCULATE:
    case scenes.PC_UNITS_CALCULATOR_WHAT:
    case scenes.PC_UNITS_CALCULATOR_SIZE:
    case scenes.PC_UNITS_CALCULATOR_STRENGTH:
    case scenes.PC_UNITS_CALCULATOR_DRINKS_NUMBER:
    case scenes.PC_UNITS_CALCULATOR_TABLE:
      return 1;
    default:
      console.log(`ERR not found step for route ${routeName}`);
      return -1;
  }
}

const stepsOptions = {
  nSteps: 2,
  getStep,
};

const PCDrinkingNavigator = SubStepsNavigator(
  PCDrinkingScenes,
  { navigationOptions: { gesturesEnabled: false }, headerMode: 'none' },
  stepsOptions
);

export default PCDrinkingNavigator;

我在我的组件中发送我的动作：

class PCDrinkingDays extends Component {

  onDone = () => {
    this.props.dispatch(navigate(scenes.PC_HELP_ME_CALCULATE));
  };

  render() {
    return (
      <SceneSelectNumber
        goBack={this.goBack}
        onChangeNumber={this.onChangeNumber}
        selectedNumberValue={this.props.daysInAweek}
        onDone={this.onDone}
        sceneConfig={sceneConfig}
      />
    );
  }
}

Answer 1

你的行动似乎无处可去。你应该使用

this.props.navigation.dispatch(navigate(scenes.PC_HELP_ME_CALCULATE));

或者您甚至可以使用

this.props.navigation.navigate(scenes.PC_HELP_ME_CALCULATE);

反应导航，调度动作改变场景 - 场景不显示

react-navigation, dispatch action to change scene - scene not showing

react-native

react-navigation