响应式编程学习(二)redux中响应式编程的运用

在redux的架构中,共有如下几个模块:

1:compomnents 展示组件

2:react 容器组件

3:action 事件处理

4:saga 异步处理

5:reducer 状态处理

6: 选择器状态业务封装

在这里:

  展示组件与容器组件的沟通 通过属性来传递,展示组件之间的沟通 由容器组件统一控制

  容器组件与reducer的通信 通过派发事件和监听改变来进行

扫描二维码关注公众号,回复: 9798373 查看本文章

  saga异步处理中心 通过派发action 通知reducer异步处理的结果,同时action通过继续派发action通知saga开启异步处理

  选择器与reducer之间是依赖的关系,所以选择器选择监听reducer的改变

  容器组件监听选择器的改变,来完成数据展示

在上面,除了展示组件与容器组件之间的沟通是通过属性来完成,其他的模块 都是通过派发事件和监听改变来完成通信。所以 在redux项目中 这6大模块之间的耦合度非常低,可以随意替换。

下面讨论一下,父子之间的沟通是采用属性传递的方式还是采用事件监听的方式,在react中 子对象通知父对象主要是通过子对象使用父对象在属性中传递的方法来完成的,而父对象通知子对象主要是通过传递给子对象属性来完成的。属性是用来初始化 子元素的不同形态的,而在react中 很显然 属性还承担着另外一个重要的职责,就是完成父子之间的通信,如果我们把父子之间的通信 采用事件机制来处理呢?很显然 这个时候 子元素 改变不需要很多,只需要将this.prop.func 改为this.event.emit('func-name')即可,而父元素 的改变就是 不需要将方法显性的传递给子元素,而是改为 在本身的事件处理中心注册事件,同时如果父元素需要通知子元素 只需要发布事件,而子元素监听事件即可,这种模式的好处是 属性得到了解放,属性的职责仅仅是定义元素的形态。同时父子元素的通信实现了无限制,因为在之前 随着业务逻辑的不断扩展,属性会越来越多,而现在 只需要不断的注册和发布事件即可。

 

猜你喜欢

转载自www.cnblogs.com/mrzhu/p/12482511.html