Question

我正在尝试使用history.push（）将props传递给React中的另一个组件。我的代码如下：

 history.push({pathname:`/tickets/solveticket`,
                state:{ticket:this.props.ticketInfo, user:this.props.currentUser}}); 


 window.location.reload()

历史记录是这样导出的：

 import { createBrowserHistory } from 'history';

export const history = createBrowserHistory();

和我的路线配置：

 import {BrowserRouter as Router,Route,Switch,Link } from "react-router-dom"; 
    <Router history={history}> 
    ... <PrivateRoute exact path="/" component={Dashboard} />
                    <Route exact path="/login" component={Login} />
                    <Route exact path="/register" component={Register} />


                    <PrivateRoute exact path="/dashboard" component={Dashboard} />

`

和在/ tickets / solveticket url上呈现的组件采用这样的历史记录参数：

constructor(props){
    super(props)
    this.state={
       ticketToSolve:this.props.location.state.ticket,
       currentUser:this.props.location.state.user
    }
}

但是我遇到了这个错误：

TypeError：无法读取未定义的属性“票证”

我尝试将所有内容都包装在withRouter中，但仍然无法正常工作。我也尝试使用this.props.history.push而不是导出的历史记录，但是在那种情况下，我的历史记录无法识别..我已经搜寻了整整一天，没有任何想法可以尝试，所以如果有人有任何想法请写下来..提前谢谢：）

Answer 1

尝试

constructor(props){
    super(props)
    this.state={
       ticketToSolve:"",
       currentUser:""
    }
}
componentDidMount(){
 if(this.props.location.state){
  this.setState({
       ticketToSolve:this.props.location.state.ticket,
       currentUser:this.props.location.state.user
    })
  }
}

由于有些时间，您不能确保已设置变量。可能会做出反应，先呈现此代码。

Answer 2

您需要通过“ history.push”传递值，例如：

history.push(`/tickets/solveticket`, {
  ticket:this.props.ticketInfo, 
  user:this.props.currentUser
});

希望这对您有用。

在react-router中使用history.push（）传递道具时出现问题

2 个答案: