在使用两个不同的导航器从一个屏幕转换到另一个屏幕时,我遇到了这种情况: ex-navigation 和新的 React Navigation 。有白色闪烁一秒钟(或半秒钟)。在寻找解决方案时,我发现其他导航器也有同样的问题。例如来自 wix HERE的导航器 。从链接:
好的,问题是,React 样式在导航开始后应用,默认情况下 backgroundColor 是白色,所以这是闪烁效果..
有人有同样的问题吗?
react-native exponentjs react-native-navigation wix-react-native-navigation velo
我有以下结构:
const routeConfiguration = {
Login: { screen: Login },
Home: { screen: TabBar },
};
const stackNavigatorConfiguration = {
headerMode: 'screen',
navigationOptions: {
header: { visible: false }
}
};
export const RootNav = StackNavigator(routeConfiguration, stackNavigatorConfiguration);
Run Code Online (Sandbox Code Playgroud)
我的TabBar,每个Tab都有自己的StackNavigator:
const routeConfiguration = {
TabOneNavigation: { screen: TabOneNavigation },
TabTwoNavigation: { screen: TabTwoNavigation },
TabThreeNavigation: { screen: TabThreeNavigation },
};
const tabBarConfiguration = {
tabBarOptions: {
activeTintColor: 'white',
inactiveTintColor: 'lightgray',
labelStyle: {
fontSize: 10,
fontFamily: Fonts.book
},
style: {
backgroundColor: Colors.greenLightGradient,
borderTopWidth: …
Run Code Online (Sandbox Code Playgroud) 我正在尝试检查用户是否已连接到互联网.我正在使用这样的NetInfo(来自文档):
componentDidMount() {
NetInfo.isConnected.addEventListener('change', this.handleConnectionChange);
NetInfo.isConnected.fetch().done(
(isConnected) => { this.setState({ status: isConnected }); }
);
}
componentWillUnmount() {
NetInfo.isConnected.removeEventListener('change', this.handleConnectionChange);
}
handleConnectionChange = (isConnected) => {
this.setState({ status: isConnected });
console.log(`is connected: ${this.state.status}`);
}
Run Code Online (Sandbox Code Playgroud)
奇怪的是,第一次加载屏幕我正在做这个工作正常.但是当我开始打开我的wifi时,结果会有所不同:有时它会检测到有时没有的变化.有人有同样的问题吗?
我想在登录(欢迎)后用户导航到Home.我重置了历史记录,因此用户无法像这样返回:
const actionToDispatch = NavigationActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'Home' })]
});
this.props.navigation.dispatch(actionToDispatch);
Run Code Online (Sandbox Code Playgroud)
这工作正常.按下注销后,用户应该返回欢迎,但它不起作用.这就是我在做什么:
const resetAction = NavigationActions.reset({
index: 0,
actions: [
NavigationActions.navigate({ routeName: 'Welcome' }),
]
});
this.props.navigation.dispatch(resetAction);
Run Code Online (Sandbox Code Playgroud)
该错误表示没有"欢迎"的路线.必须是"主要","隐私","条款"之一,它们是主页中某个标签的路线.见下文:
const AppStack = StackNavigator({
Welcome: {
screen: Welcome
},
Home: {
screen: Tabs
}
}, {
initialRouteName: this.state.isLoggedIn ? 'Home' : 'Welcome',
headerMode: 'none'
}
);
export const ProfileStack = StackNavigator({
Profile: {
screen: Profile,
},
});
export const SettingsStack = StackNavigator({
Settings: {
screen: Settings,
}, …
Run Code Online (Sandbox Code Playgroud) 我希望有一个屏幕作为抽屉路线的一部分,但在抽屉打开时不可见(抽屉物品).这是我的配置:
const DrawerRoutes = {
Home: {
name: 'Home',
screen: StackNavigator(HomeStack, { initialRouteName: 'HomeTab', ...navOptions })
},
Notifications: {
name: 'Notifications',
screen: StackNavigator(Stack, { initialRouteName: 'NotificationsTab', ...navOptions })
},
LastAdded: {
name: 'LastAdded',
screen: StackNavigator(VideosStack, { initialRouteName: 'LastAddedTab', ...navOptions })
},
ChangeLog: {
name: 'ChangeLog',
screen: StackNavigator(Stack, { initialRouteName: 'ChangelogTab', ...navOptions })
},
AboutUs: {
name: 'AboutUs',
screen: StackNavigator(Stack, { initialRouteName: 'AboutUsTab', ...navOptions })
},
Test: {
name: 'Test',
screen: StackNavigator(ProfileStack, { initialRouteName: 'ProfileScreen', ...navOptions })
}
};
export const …
Run Code Online (Sandbox Code Playgroud)