我正在使用 StackNavigator 开发 React Native 菜单。如果用户按下 ListItem,则应将 id 传递到此菜单中的所有其他选项卡,以便可以从 API 获取数据。我尝试使用 screenProps 来传递数据。不幸的是,当按下 ListItem 时,我无法重置该值。
export default class Index extends Component {
constructor(props){
super(props);
}
render() {
return (
<OrderScreen
screenProps={ { Number: 123 } }
/>
);
}
}
在子组件中,我可以访问该 Prop ,但不能重新分配它:
export default class ListThumbnailExample extends Component
{
constructor(props)
{
super(props);
const{screenProps} = this.props;
this.state = { epNummer: screenProps.Number };
}
render()
{
return (
<Content>
<List>
{
this.state.orders.map(data => (
<ListItem key = {data.Number}
onPress = {() =>
{
this.props.screenProps.Number = data.Number;
this.props.navigation.navigate('Orders')
}
}
<Text>{ data.name }</Text>
</ListItem >
))
}
</List>
</Content >
);
}
}
谢谢!
最佳答案
在 React 和 React-native 中,props 在设计上是不可变的: https://reactjs.org/docs/components-and-props.html#props-are-read-only
在您的情况下,如果您想传递特定于屏幕的数据,您可能想尝试将它们传递到 navigation.navigate() 函数的参数中,如下所示:
this.props.navigation.navigate('Orders',data.Number)
然后您可以在“订单”屏幕中访问它们:props.navigation.state.params
关于javascript - RN - 更改 parent 的 screenProps,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49692486/