是否可以更改react native navigator中的转换？

Question

我有3个不同的反应本机组件，我使用Navigator在它们之间导航。在我的第一个视图中，我定义了导航器：

查看1

<Navigator
    ref="nav"
    renderScene={@renderScene}
    initialRoute={@renderContent(I18n.t("Incidents"))}
    configureScene={ ->
      transition = Navigator.SceneConfigs.HorizontalSwipeJump
      transition.gestures = null
      transition
    }
  />

如您所见，转换是Horizo​​ntalSwipeJump。

查看2

 @props.navigator.push
  component: IncidentScreen
  incidentId: incident.id
  sceneConfig: -> Navigator.SceneConfigs.FloatFromBottomAndroid

正如您所看到的，我正在尝试使用FloatFromBottomAndroid进入视图＃3，但是，它无法正常工作。

通过查看RN的源代码，我可以看到navigator.push方法从道具获取动画：

var nextAnimationConfigStack = activeAnimationConfigStack.concat([
  this.props.configureScene(route),
]);

那我该怎么办？

非常感谢。

Answer 1

你必须深入研究react-native源here以获取SceneConfigs列表，但是这里是写作时的当前列表：

PushFromRight
FloatFromRight
FloatFromLeft
FloatFromBottom
FloatFromBottomAndroid
FadeAndroid
HorizontalSwipeJump
HorizontalSwipeJumpFromRight
VerticalUpSwipeJump
VerticalDownSwipeJump

使用示例：

<Navigator
  configureScene={(route) => {
    if (someCondition) {
      return Navigator.SceneConfigs.HorizontalSwipeJump;
    } else {
      return Navigator.SceneConfigs.PushFromRight;
    }
  }}
/>

Answer 2

如果有人还在看这个，那么只需将路线重置为您希望它们最终成为的路线，就可以在没有动画的情况下进行推动。这假设你没有对你的路线做任何特别的事情，比如保存前方路线或任何东西。

if( !shouldAnimate )
{
  var routeStack = this.refs.mainNav.state.routeStack;
  routeStack.push(newRoute);
  this.refs.mainNav.immediatelyResetRouteStack(routeStack);
}
else
{
  this.refs.mainNav.push(feature);
}

其中mainNav是导航器的参考号。希望这会有所帮助。