是的
分享一个 react + redux 完整的项目,同时写一下个人感悟
luckykun
#47
楼主你好。我使用react-redux的过程有一个问题很费解。希望能得到解答,万分感谢。
在connect方法生成容器组件的时候,大家都说如果在mapStateToProps中传入ownProps参数,那么ownProps的变化也会触发ui组件的更新。
但是我实际操作如下,却没有达到预期的效果:
- 生成容器组件
const mapStateToProps = (state, ownProps) => {
return {
...ownProps,
visibleTodos: showTodos(state.todos, state.filterString)
}
};
const MyApp = connect(mapStateToProps, mapDispatchToProps)(TodoApp);
export default MyApp
- 使用容器组件
var config = {
text: 'todo list'
};
ReactDom.render((
<Provider store={store}>
<MyApp {...config} />
</Provider>
), document.getElementById('app'));
到这一步骤,没有问题,可以正常渲染,如下图:
- 改变config
setTimeout(function() {
config.text = 'new todo list';
}, 2000);
我间隔两秒,将config改变,也就是传入的容器组件的ownProps被改变。但是页面没有刷新。
这个问题困惑我很久了。。。希望楼主有空能帮忙解答一二,不胜感激!!!
bailicangdu
#48
组件属性的更新是自上而下的形式,也就是父组件传递新的属性给子组件,触发子组件的更新。你直接定义一个对象作为属性,虽然改变了config的值,但是组件并不知道config发生了变化
Angry-Rabbit
#58
@bailicangdu 跟着你的总结思考,让我的思路也清晰了很多。那张React组件生命周期的流程图有两点错误:开始的节点名字是Start;组件卸载事件 componentWillUnmount写成了compnentWillMount。
bailicangdu
#64