如何更新通过 React 路由器传递的状态 link

Question

所以我正在使用 react-router，在我用 Link 从 page1 发送一些状态到 page2

<Link
  to={{
    pathname: `/dashboard/edit/${resort.id}`,
    state: { resort: resort },
  }}
  style={{ textDecoration: 'none', color: 'black' }}
>
  <i
    className="fas fa-edit db-icon"
    style={{ background: 'rgb(12, 177, 12)', color: 'black' }}
  ></i>
</Link>;

当我进入第 2 页时，如何更新此状态，我试过使用 this.setState，但这不起作用，我试过像下面那样解构发送过来的状态，但没有成功'也不工作

constructor() {
  super();
  this.state = {
    title,
    price,
    desc,
    img,
    smoking,
    guests,
    featured,
  } = this.props.location.state.resort;        
}

有什么建议吗？

Answer 1

NEVER mutate this.state directly

这样试试：

constructor() {
  super();
  this.state = { resort: {} };      
}

componentDidMount = () => {
  this.setState({resort: this.props.location.state.resort});
}

Answer 2

考虑使用 componentDidMount 生命周期挂钩并使用 setState 将这些值设置为组件 state 像这样

像这样

constructor() {
  super();
  this.state = {
    resort: {}
  }
}

compoonentDidMount() {
  this.setState({ resort: this.props.location.state.resort })
}

如何更新通过 React 路由器传递的状态 link

How to update state that is passed through react router link

javascript

state

reactjs

react-router

routerlink