Question

以下是我的反应 MainComponent 中的构造函数，它在传递为id时从路由器接收<Link to={"/main/108"}，并且控制台提供id: 108。

constructor(props) {
            super(props);  
            this.state = {
                    id: this.props.params.id
            }
            console.log('id: '+id)
    }

我有一个 ChildComponent ，在其功能之后返回 MainComponent 并使用参数id <MainComponent id={this.state.id}/>。如果我在构造函数中将状态设置为

this.state = {
            id: this.props.id
            }

可以正常使用，但会为Link功能提供错误。

由于此类参数应作为id: this.props.id接收，因此我无法使构造函数接受路由器和子组件的id。

简单地说，我只需要从Link to=和通过ChildComponent设置id的值。

我该如何解决这个问题？

Answer 1

您可以添加OR条件。即如果 ChildComponent 传递 id ，请使用状态。否则，请使用链接传递的 id 。

this.state = {
   id: props.id || props.params.id
}

ReactJS如何以相同的方式从子组件和路由器传递参数

1 个答案: