我正在尝试使用React Router将props从我的app.jsx传递到我的路由组件之一,但是出现以下错误



这是我的app.jsx中的代码:

<Route exact path='/FileUpload' acc={this.state.account} ethAdd={this.state.ethAddress} component={FileUpload} />

路由中的组件中的代码将导致:
constructor(props) {
        super(props);
        this.setState({
            account: this.props.route.acc,
            ethAddress: this.props.route.ethAdd
        })
    }

我从这里阅读其他解决方案并不能真正理解在响应路由器中传递 Prop 的工作原理,有人可以帮助我理解我需要做什么吗?

最佳答案

<Route>不会将自定义 Prop 传递给组件。使用render function代替:

<Route exact path='/FileUpload' render={
  (props) => <FileUpload {...props} acc={this.state.account} ethAdd={this.state.ethAddress} />
} />

正如SakoBu所提到的,您需要更改构造函数:
constructor(props) {
    super(props);
    this.state = {
        account: this.props.acc,
        ethAddress: this.props.ethAdd
    };
}

关于reactjs - react 路由器传递 Prop 以路由组件,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55328558/

10-13 01:33