这个问题主要是因为组件生命周期方法的执行顺序你没有搞清楚,在轮播组件componentDidMount执行时,主页面组件Recommend的componentDidMount都还没有执行,父组件的componentDidMount是在所有子组件的componentDidMount都执行完成后才执行。 当Recommend的componentDidMount执行完成,也重新调用setState后,你的子组件的state并不会改变,因为componentDidMount只会被调用一次,所以你没法在这个方法中根据新的props更新你的state,非要这么做的话,应该在子组件的componentWillReceiveProps(nextProps)这个方法中做。 但就你的这个场景来说,子组件是没有必要维护自己的state的,直接在子组件render中使用父组件传递的props.picPath渲染子组件,这样父组件state变化,传递给子组件的props就会变化,子组件每次render都是使用的最新的props。也就是把子组件设计成无状态组件。
解决了,忘记了可以先判断再渲染。我在父组件里把轮播图的子组件单独放在一个函数内,在函数内判断this.state.banner是不是为空,为空就return空,不为空就return子组件,并把值传递过去!
这个问题主要是因为组件生命周期方法的执行顺序你没有搞清楚,在轮播组件componentDidMount执行时,主页面组件Recommend的componentDidMount都还没有执行,父组件的componentDidMount是在所有子组件的componentDidMount都执行完成后才执行。
当Recommend的componentDidMount执行完成,也重新调用setState后,你的子组件的state并不会改变,因为componentDidMount只会被调用一次,所以你没法在这个方法中根据新的props更新你的state,非要这么做的话,应该在子组件的componentWillReceiveProps(nextProps)这个方法中做。
但就你的这个场景来说,子组件是没有必要维护自己的state的,直接在子组件render中使用父组件传递的props.picPath渲染子组件,这样父组件state变化,传递给子组件的props就会变化,子组件每次render都是使用的最新的props。也就是把子组件设计成无状态组件。
这个是异步的,第一次打印的时候确实是空的。
在你的子组件里面
`state = {
}`
你这个问题的主要原因应该是在 MAP 的时候 item是 undinfind
不是数据传输问题
解决了,忘记了可以先判断再渲染。我在父组件里把轮播图的子组件单独放在一个函数内,在函数内判断this.state.banner是不是为空,为空就return空,不为空就return子组件,并把值传递过去!