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);

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

1 个答案: