Question

在我的navReducer.js中，有以下处理.pop和.push的内容。但是遵循相同的指导原则，使用NavigationStateUtils，我如何实现.replace用新路由替换当前场景？很像Navigator.replace。

import { NavigationExperimental } from 'react-native'

const {
  StateUtils: NavigationStateUtils
} = NavigationExperimental

function navigationState (state = initialState, action) {
  switch(action.type) {

    case PUSH_ROUTE:
      if (state.routes[state.index].key === (action.route && action.route.key)) return state
    return NavigationStateUtils.push(state, action.route)

    case POP_ROUTE:
      if (state.index === 0 || state.routes.length === 1) return state
      return NavigationStateUtils.pop(state)

   default:
     return state

  }
}

export default navigationState

Answer 1

但是它已经在NavigationStateUtils了吗？

Wait()

Answer 2

签出＆＃34; navigationStateUtils.jumpTo＆＃34;方法： https://github.com/facebook/react-native/blob/master/Libraries/NavigationExperimental/NavigationStateUtils.js

它通过给定的路由键进行重定向。 重要提示：您必须注意通过＆＃34; navigationStateUtils.push＆＃34;再次推送相同的路由键。在此操作之后。

这是方法的内在结构：

jumpTo(state: NavigationState, key: string): NavigationState {
    const index = NavigationStateUtils.indexOf(state, key);
    return NavigationStateUtils.jumpToIndex(state, index);
}

使用已实现的方法编辑您的代码版本：

import { NavigationExperimental } from 'react-native'

const {
  StateUtils: NavigationStateUtils
} = NavigationExperimental

function navigationState (state = initialState, action) {
  switch(action.type) {

    case PUSH_ROUTE:
      if (state.routes[state.index].key === (action.route && action.route.key)) return state
    return NavigationStateUtils.push(state, action.route)

    case POP_ROUTE:
      if (state.index === 0 || state.routes.length === 1) return state
      return NavigationStateUtils.pop(state)

    case JUMP_TO_ROUTE:
      return NavigationStateUtils.jumpTo(action.routeKey)

   default:
     return state

  }
}

export default navigationState

如何在React Native + Redux中使用NavigationStateUtils实现Navigator.replace？

2 个答案: