小编vak*_*nzi的帖子

转换到新屏幕时白色闪烁,背景是深色?

在使用两个不同的导航器从一个屏幕转换到另一个屏幕时,我遇到了这种情况: ex-navigation 和新的 React Navigation 。有白色闪烁一秒钟(或半秒钟)。在寻找解决方案时,我发现其他导航器也有同样的问题。例如来自 wix HERE的导航器 。从链接:

好的,问题是,React 样式在导航开始后应用,默认情况下 backgroundColor 是白色,所以这是闪烁效果..

有人有同样的问题吗?

react-native exponentjs react-native-navigation wix-react-native-navigation velo

7
推荐指数
2
解决办法
1万
查看次数

使用反应导航重置TabNavigator历史记录

我有以下结构:

    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)

react-native react-navigation

5
推荐指数
1
解决办法
969
查看次数

检查互联网连接是否返回错误结果

我正在尝试检查用户是否已连接到互联网.我正在使用这样的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时,结果会有所不同:有时它会检测到有时没有的变化.有人有同样的问题吗?

react-native

4
推荐指数
1
解决办法
2493
查看次数

使用反应导航将导航历史重置为登录屏幕

我想在登录(欢迎)后用户导航到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)

reactjs react-native react-navigation

3
推荐指数
1
解决办法
5551
查看次数

打开时隐藏抽屉中的抽屉物品

我希望有一个屏幕作为抽屉路线的一部分,但在抽屉打开时不可见(抽屉物品).这是我的配置:

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)

react-native

2
推荐指数
2
解决办法
4353
查看次数