React Navigation 5 условного рендеринга с неработающим редуксом - PullRequest
Новая
       22

React Navigation 5 условного рендеринга с неработающим редуксом

0 голосов
/ 12 апреля 2020

Привет, ребята, я пытаюсь понять новую реагирующую навигацию. 5 Я работаю с Redux, но я приведу небольшой пример, чтобы вы поняли мою проблему, так что ...

я создал

Stack. js файлов, куда можно поместить весь мой стек на данный момент, я просто использую 2, такие как LoginStack и TabNavStack (которые перенаправляют на HomeScreen), теперь для примера я просто сделал один навигатор стека и передал функцию компонента, так что вот code:

Stack. js 

const Stack = createStackNavigator();
const Tab = createBottomTabNavigator();

export function TestStackNav() {
    const isAuth = useSelector(state => state.loginReducer); // i will explain why i need this thing here :)

    return <Stack.Navigator>
                <Stack.Screen
                        name="LoginScreen"
                        component={LoginContainer}/>
                <Stack.Screen 
                    name="TabNav"
                    component={TabNav}/>
            </Stack.Navigator>
}

 export function TabNav() {
    return (
        <Tab.Navigator>
            <Tab.Screen name="AnimeScreen" component={AnimeContainer} />
            <Tab.Screen name="HomeScreen" component={HomeScreen} />
            <Tab.Screen name="SettingsScreen" component={SettingsScreen} />
        </Tab.Navigator>

    );
}

Теперь в моем loginContainer я сделал работать с избыточностью и просто отправлять реквизиты и другие вещи, но контейнер ПОДКЛЮЧАЕТСЯ к LoginScreen, и это прекрасно работает, потому что в в начале приложения мы видим экран входа в систему теперь на экране входа в систему. У меня есть кнопка «БОЛЬШОЙ И СТАРЫЙ», где проверяемые данные отправляют действие и другие вещи, а в конце просто перейдите к this.props.navigation.navigate («TabNav»). ", {screen: 'HomeScreen'}), и это прекрасно работает, потому что он перенаправляет меня на домашний экран .... НО проблема в том, что если я использую условный рендер на основе того, что у меня есть в моем reduxStore в стеке. js вот так 

export function TestStackNav() {
    const isAuth = useSelector(state => state.loginReducer);
    return <Stack.Navigator>
        {isAuth.logged ?
            <Stack.Screen
                name="TabNav"
                component={TabNav} />
            :
            <Stack.Screen
                name="LoginScreen"
                component={LoginContainer}
            />}
    </Stack.Navigator>
}

так что теперь с тем же логикой c, но просто помещая условный рендер из Хранилище reduxStore, которое я получаю enter image description here

Я буквально изменил все, что LoginScreen остался прежним, все остальные экраны остались прежними, но просто добавив условный рендер в Навигатор стека, я получил эту ошибку. ... может кто-то, пожалуйста, помогите мне ... я попытался сделать код простым ... я уже видел контекст, используемый в документах реагировать на навигацию, но на данный момент я не хочу использовать его, потому что я должен вникать в него больше. Спасибо за вашу помощь :)

1 Ответ

0 голосов
/ 29 апреля 2020

Определили ли вы стековый навигатор и вкладочный навигатор? т.е. 

const Stack = createStackNavigator(); ?
...