Question

我正在使用React与react-router和react-redux。当一个组件安装时，我会调度以从数据库中获取数据。我的父组件有这个

const TopComp = React.createClass({  
 componentWillMount(){
     this.props.dispatch(getData(this.params.id))
 },
 render() {
  <ChildComp data={this.props.data} />
 }
})
function mapStateToProps(state){
    return {data:state.data}
 }
export default connect()(TopComp)

我的孩子组件看起来像这样：

 const ChildComp = React.createClass({
 getInitialState() {
  console.log(this.props.data) 
 //empty for the first time but gets data other times
 }
 render(){
 console.log(this.props.data) //prints undefined
 return(
  {this.props.data} //gives the data
 ) 
 }
 })

也是我的TopComp更新，点击它的父组件上的链接。它接收不同的params.id并获取每个params.id的数据。

Answer 1

您没有通过mapStateToProps功能进行连接......所以我很惊讶您甚至可以访问您的状态数据。

export default connect(mapStateToProps)(TopComp)

至于this.props.data打印未定义 - ＆gt;你只是在父组件安装时获取数据 - 然后执行XHR请求等，所以一开始，子组件中的this.props.data将是未定义的，因为请求尚未完成。

在渲染中未定义的道具，但是在第一次安装组件的渲染中看到的值

1 个答案: