Question

我正在使用StackNavigator处理React Native菜单。如果用户按下ListItem，则应将id传递给此菜单中的所有其他选项卡，以便可以从API获取数据。我尝试使用screenProps传递数据。不幸的是，当按ListItem时，我无法重置该值。

export default class Index extends Component {
  constructor(props){
    super(props);
  }

  render() {
    return (
      <OrderScreen
          screenProps={ { Number: 123 } }
      />
    );
  }
}

在子组件中，我可以访问道具，但不能重新分配：

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 >
    );
  }
}

谢谢！

Answer 1

在React和React-native道具中不可变设计： https://reactjs.org/docs/components-and-props.html#props-are-read-only

在您的情况下，如果您想传递特定于屏幕的数据，您可能想尝试在navigation.navigate（）函数的参数中传递它们，如下所示：

 this.props.navigation.navigate('Orders',data.Number)

然后您可以在＆＃34;订单＆＃34;屏幕来自：props.navigation.state.params

此处提供更多信息：https://reactnavigation.org/docs/params.html

RN - 更改父母的screenProps

1 个答案: