Question

我使用的是createMaterialBottomTabNavigator，但是在导出之前，我想为其NavigationOptions赋值

barStyle: { backgroundColor:someVariable}

这里的问题是，我想从AsyncStorage获取someVariable的值。它返回promise，因为首先要导出createMaterialBottomTabNavigator，然后得到someVariable的值。我不会写在async函数中导出默认值，否则createMaterialBottomTabNavigator将再次作为promise返回。请提出建议。我正在使用redux，但是在导出createMaterialBottomTabNavigator之前，我还必须从AsyncStorage更新存储。

示例代码

// tabnavigator.js
// I Imported this file in app.js , there i use this in 
createSwitchNavigator
// so this will execute on app starts only

var theme = {};
AsyncStorage.getItem('theam').then((res) => {
    theme = res
});

// I want theme from storage because i am going to apply theme on app 
// start
// Here I can get theme from ReduxStore but i returns the initial one 

const DashTabsNav = createMaterialBottomTabNavigator({
    ProfileStack: {
        screen: ProfileStack,//this is stack created with 
createStacknavigator , 
        navigationOptions: {
            tabBarIcon: ({ tintColor }) => (<Icon name="user" size={25} 
color={tintColor} />),
        },
    },
    Messages: {
        screen: MessageScreen,
        navigationOptions: {
            tabBarColor: 'red',
            tabBarIcon: ({ tintColor }) => (<Icon name="comments" size= 
   {25} color={tintColor} />)
        },

    },
},
    {
        activeColor: 'white',
        inactiveColor: 'white',
        barStyle: { backgroundColor: theme.themeColor },
    },
);
export default DashTabsNav;

Answer 1

阅读https://reactnavigation.org/docs/en/headers.html#overriding-shared-navigationoptions

在您的ProfileScreen和MessageScreen中，这样做会覆盖标题颜色

  static navigationOptions = ({ navigation, navigationOptions }) => {
    return {
      headerStyle: {
        backgroundColor: theme.themeColor,
      },
    };
  };

如何从AsyncStorage在createMaterialBottomTabNavigator中设置值

1 个答案: