Как получить доступ к объекту навигации в react-native
Я новичок в реакции-навигации, и я пытаюсь реализовать простую навигацию. Проблема, с которой я столкнулся, заключается в том, что я не могу найти способ передать объект «навигации» на экран желаний. Я пробовал использовать withNavigation и т.д .. он все еще бросает "this.props.navigation" не определено !. Из того, что я прочитал, если я объявляю экран в rootStack, объект навигации автоматически передается компоненту, верно?
так вот мой rootStack
/* ROUTING RULES */
const RootStack = createStackNavigator(
{
Main: Main,
ChatBox: ChatBox,
},
{
initialRouteName: 'Main',
}
);
/* End */и это метод, который я использую для навигации по экрану чата
()=>this.props.navigation.navigate('ChatBox', {
avatarUrl: matches.avatarUrl,
name: matches.name,
})Я заметил, что с моего главного экрана я мог получить доступ к навигации без каких-либо проблем, но когда я попытался запустить простой console.info на моем экране chatBox
constructor(props){
super()
console.info(this.props.navigation)
}Я получаю «TypeError: undefined не является объектом (оценка'_this.props.navigation ')»
Может кто-нибудь помочь мне разгадать эту загадку ?? Благодарность :)
@ DNA.h да, конечно .. Я добавил недостающий код, пожалуйста, посмотрите
Ответы 2
В вашем конструкторе это не нужно для доступа к реквизитам. Попробуй это
constructor(props){
super(props);
console.info(props.navigation.getParam('avatarUrl');
}
Обновлено: вам тоже нужно было передать реквизит в супер! не отправка может вызвать некоторые ошибки.
Он по-прежнему выдает сообщение «Инвариантное нарушение: недопустимый тип элемента, ожидается строка (для встроенных компонентов) или класс / функция ....»
Я очень подозрительно отношусь ко второму аргументу. вероятно, это связано с другой частью кода. вы можете поделиться своим кодом?
Попробуйте использовать методы жизненного цикла вместо конструктора
componentDidMount() {
console.info(this.props.navigation)
}
Привет, Тарек, твое решение работает! хм, вы можете дать объяснение: D
потому что this.props настраивается самим React как часть работы, которую он выполняет под капотом, поэтому использование его внутри методов жизненного цикла - это не только лучшая практика, но и имеет смысл, первый метод жизненного цикла срабатывает, когда реакция становится готовой, конструктор предназначен только для установки свойств класса, таких как состояние, и поскольку props - это задание React для установки, попытка использовать его из конструктора не является хорошей идеей, потому что есть вероятность, что React еще не готов и не получил возможности сделать его работа под капотом
Большое спасибо за помощь (flex): D
Как вы переходите на экран ChatBox? вы можете поделиться своим фрагментом кода для этого?