标签: ex-navigation

有一点令人困惑的是路由名称和密钥之间的区别以及为什么要使用一个与另一个相比.并且,如何处理重复的路由名称.

此文档说您用于routeName导航到屏幕,这key是"用于对路径进行排序的唯一标识符".那是什么意思？

看起来路由名称不必是唯一的,如我的例子中所示,因为外部选项卡和内部堆栈具有相同的路由名称.当您使用导航功能时 - 您传递路线名称,对吗？如果是这样,它如何区分嵌套导航器中的重复路径名称以及何时使用该键？

        export TabsNavigator = TabNavigator({
          Home: {
            screen:StackNavigator({
              Home: { screen: HomeScreen },
            }),
          },
          Profile: {
            screen: StackNavigator({
              Profile: { ProfileScreen },
            }),
          },
        });

文档中有一个设置密钥的示例,但我无法理解它正在尝试执行的操作的上下文,或者为什么要在实际用例中执行此操作.

import { NavigationActions } from 'react-navigation'

const setParamsAction = NavigationActions.setParams({
  params: {}, // these are the new params that will be merged into the existing route params
  // The key of the route that should get the new params
  key: 'screen-123',
})
this.props.navigation.dispatch(setParamsAction)

我一直在开发本机应用程序，并已在IOS和Android模拟器以及处于调试模式的设备上运行它。我已经打包并签署了发行版本，以准备进入应用商店和Play商店。

IOS版本似乎可以正常工作，但是Android apk给我以下错误：

““ redux-persist：无法处理循环状态。请考虑将您的状态结构更改为没有周期。或者将相应的reduce键列入黑名单。在键“ / feed”遇到的周期值为“ [object Object]”。”

谁能告诉我这是什么意思以及如何解决？

我在主应用程序文件中使用redux-persist和ex-navigation进行路由，如下所示：

<Provider store={ store }>
   <NavigationProvider context={ navigationContext }>
     <StackNavigation id="root" navigatorUID="root" initialRoute={  Router.getRoute('splash') } />
   </NavigationProvider>
</Provider>

和我的初始化存储文件：

import { AsyncStorage } from 'react-native';
import { createStore, applyMiddleware, compose } from 'redux';
import { createNavigationEnabledStore } from '@exponent/ex-navigation';
import thunkMiddleware from 'redux-thunk';
import devTools from 'remote-redux-devtools';
import { persistStore, autoRehydrate } from 'redux-persist';
import rootReducer from './reducers/';

const createStoreWithNavigation = createNavigationEnabledStore({
  createStore,
  navigationStateKey: 'navigation'
});

export function initStore (initialState) …

我正在编写 React Native 应用程序。我正在使用反应导航来导航屏幕。

我有 2 个堆栈导航器，它们位于选项卡导航器中。当我按下 TabBar 上的选项卡项以刷新其视图时，我想要处理单击事件。

export const HomeStack = StackNavigator({
  Home: {screen: ScreenHome},
  Detail: {screen: ScreenDetail}
})
export const UserStack = StackNavigator({
  User: {screen: ScreenUser}
})
export const Tabbar = TabNavigator({
  HomeTab: {
    screen: HomeStack,
  },
  UserTab: {
    screen: UserStack,
  }   
}, {
  tabBarComponent: ({ jumpToIndex, ...props}) => (
       <TabBarBottom
          {...props}
          jumpToIndex={(index) => {
            if(props.navigation.state.index === index) {
            props.navigation.clickButton(); //----> pass props params (code processes)
          }
          else {
            jumpToIndex(index);
          }
        }
      }
    />
   ),
   tabBarPosition: 'bottom' …