React Native: Why doesn't a component render after a redirect?

Question

Mobile development

I am writing an application on RN and decided to enable routing via react-router-native .

const state = {
    authStore: {
        isAuth: true,
    }
};

const PrivateRoute = ({ component: Component, ...rest }) => (
    <Route
        {...rest}
        render={props =>
            state.authStore.isAuth ? (
                <Component {...props} />
            ) : (
                <Redirect
                    to={{
                        pathname: '/login',
                        state: { from: props.location },
                    }}
                />
            )}
    />
);

<Provider store={store}>
        <NativeRouter>
            <View>
                <Container>
                    <Route path="/registration" component={Registration} />
                    <Route path="/login" component={Login} />
                    <PrivateRoute path="/" component={Masters} />
                </Container>
            </View>
        </NativeRouter>
    </Provider>

The redirect happens to /login , but that component is not rendered. If you run Toggle Element Inspector , then everything is ok.
Tell me how to solve this problem? I do not want to redo the routing to another one, I have already made my choice, but I ran into such a problem and I don’t understand how to solve it for the second day.

Answer 1

I at least see an undeclared state variable, maybe you always have undefined there?