完成渲染后更新React状态

Question

我正在学习反应的生命周期方法，并且我想知道如何最好地解决这个问题：

我有一个组件可以获取有关某人兴趣爱好的信息

  componentWillMount() {
    this.props.fetchHobbies(this.props.params.id);
  }

数据被发送到reducer，该reducer被映射为组件底部的prop

function mapStateToProps(state) {
  return { 
    hobbies:state.hobbies.user
  };
}

我有一个名为twitterbootstrap的组件，它依赖于我的组件状态来查看选择了哪些行。

const selectRowProp = {
  mode: 'radio',
  clickToSelect: true,
  bgColor: "rgba(139, 195, 74, 0.71)",
  selected: this.state.selected,
};

这是我的问题。我想访问this.props.hobbies.selected。

- 更新我使用componentWillRecieveProps，因为它有一个setState选项。

componentWillReceiveProps(nextProps){
    this.setState({selected:next.props.hobbies })
} 

我想使用this.props.hobbies.selected作为接收的下一个道具。我该如何加入？

Answer 1

nextProps是在第一次渲染后传递的props对象。函数componentWillReceiveProps中没有任何名为next.props的东西。你可以做那样的事。

componentWillReceiveProps(nextProps){
    this.setState({selected:nextProps.hobbies })
}