навигация. навигация не является функцией

Question

Я использую навигацию для навигации по своему родному приложению, и мне не удалось решить эту проблему.Я сделал как документы, но у меня ничего не работает.

Проблема в том, что я пытаюсь использовать опцию навигации, чтобы добавить заголовок и правую кнопку, чтобы перейти ко мне на другой экран, но он продолжает выдавать мне эту ошибку: "navigation.navigate не является функцией. (в навигации. навигация не определена)

Вот мой код:

    static navigationOptions = (navigation) => {
        return {
            title: 'Review Jobs',
            headerRight: (<Title onPress={()=>{navigation.navigate('settings')}}>Settings</Title>)
        };
    };

спасибо

Answer 1

Это общая проблема с React, особенно если вы не понимаете новейшие стандарты JS (например, ES6, который используется в React).

Итак, ваша проблема здесь концептуальная.Компоненты React получают один объект с именем props, который содержит все props.Обычно вы используете деконструирующую форму для непосредственного получения некоторых атрибутов реквизита.В этом случае вы хотите иметь props.navigation.

. Вы можете деконструировать объект props в аргументах функции стрелки, как это делает документация, с ({navigation}) => ... вместо (navigation) => ...

Это то же самое, что и (props) => ..., а затем props.navegation

Вам также необходимо изменить функцию onPress.Использование блока {...} в функции стрелки ничего не вернет, если вы не укажете return.Если у вас нет функции тела с {...}, то это то же самое, что написать {return ...}.Таким образом, если вы хотите вернуть navigation.navigate('settings'), вам нужно удалить окружающий {...} или записать возврат внутрь.

    static navigationOptions = ({navigation}) => {
        return {
            title: 'Review Jobs',
            headerRight: (<Title onPress={()=> navigation.navigate('settings')}>Settings</Title>)
        };
    };

Также вы можете сделать то же самое с вашей функцией navigationOptions:

    static navigationOptions = ({navigation}) => ({
        title: 'Review Jobs',
        headerRight: (<Title onPress={() => navigation.navigate('settings')}> Settings </Title>),
    });