Как передать реквизиты дочернему компоненту от родителя в react-native?
Есть ли идеи, как отправлять реквизиты дочернему компоненту из родительского в react native. Я слышал об этом, но не знаю в react-native. Все, что я хочу, это когда пользователь нажимает кнопку AddToCart, которая на самом деле обернута в событие onpress с сенсорной непрозрачностью, реквизиты должны быть отправлены на другую страницу. Кто-то сказал мне об использовании redux, но я думаю, что это может произойти и в response-native.
Bottom Line: There's a button when it pressed the props should be sent to another page.
Страница ItemDetais
Откуда следует отправлять реквизит.
cart() {
let product_id = this.props.navigation.state.params.id;
AsyncStorage.getItem('cart_id')
.then((_id) => {
API.post_data(_id, product_id)
.then((data) => {
if (data) {
// this.props.navigation.navigate('Cart', {id: data.cart.id})
// was using this method.But when I directly open
// cart page it gives me an error undefined is not
// an object..blah blah
}
})
})
}
<TouchableOpacity onPress = {()=> { this.cart() }} >
<Text>AddToCart<Text>
</TouchableOpacity>
CartPage
где должен быть получен реквизит.
componentDidMount() {
let cart_id = this.props.navigation.state.params.id;
// above method is just total waste.
API.getCartItem(cart_id)
.then((response) => {
if (response) {
this.setState({
data: response
});
} else {
alert('no data')
}
})
}
@Tholle TypeError: undefined не является объектом .. (оценка this.props.navigation.state.params.id)
Вы можете отправить данные с помощью "this.props.navigation.navigate ('Cart', {id: data.cart.id})" и просто проверить, если (this.props.navigation.state.params.id) {cart_id = this.props.navigation.state.params.id}
Я получил данные успешно. Но если я открываю страницу корзины напрямую, не нажимая кнопку addToCart ... это дает мне ошибку undefined is not an object. (Оценка this.props.navigation.state.params.id)
Создайте локальное состояние, которое обновляется и передается дочернему компоненту. Итак, когда вы нажимаете кнопку, вы обновляете состояние в родительском элементе, а затем это обновленное состояние передается дочернему компоненту.
@Sangsom Как мне обновить состояние, вызвав функцию, которая, конечно, является тележкой ...
@Yash stackoverflow.com/questions/35537229/…
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Согласно React Navigation документы это должно работать:
componentDidMount() {
const { navigation } = this.props;
// The 'NO-ID' is a fallback value if the parameter is not available
const cart_id = navigation.getParam('id', 'NO-ID');
...
}
Спасибо за ответ. с помощью этого метода исчезла только ошибка ... но пользователь также получает возможность навигации, включая cart_id ... Все, что я хочу, - это просто параметры, которые должны передаваться от родителя к дочернему или с одной страницы на другую, не позволяя пользователю перемещаться ... Просто параметры ... может ли это быть возможно в ответной навигации
Итак, вы хотите, чтобы пользователь добавлял товар в корзину, не переходя каждый раз на страницу корзины? Самый чистый способ сделать это - использовать redux. Но если вы В самом деле не хотите использовать redux, вы можете сохранить массив элементов, например itemsInCart, в состоянии каждого экрана. Затем вы можете передавать его на другой экран каждый раз, когда вызываете навигацию. Таким образом, каждая навигация будет выглядеть так .props.navigation.navigate ('ScreenName', {id: data.cart.id}). Я думаю, что это действительно неудобно, но я не могу придумать другого способа без использования redux.
да, я тоже считаю, что это слишком неудобно. Я немного знаю о redux .. Итак, как с этим справиться в redux ??
an error undefined is not an object..blah blahКакую именно ошибку вы получаете?