dva处理_关于dva框架的二三事

关于dva框架的二三事

发布时间：2018-06-24 15:31,

浏览次数：618

, 标签：

dva

前言

我开通了一个微信公共号“王和阳的航海日志”，在上面记录着自己的学习、思考、实践和成长的过程，欢迎关注、交流和拍砖。

最近在项目里用了DVA，一个基于Redux的前端应用开发框架，用dva能让我们省去配置项目的一堆麻烦事儿。关于Dva的使用和介绍这里就不多说了，官方文档已经讲得很详细了。下面简单结合我自己的实践经历，讲讲DVA的一些思想以及一些关于数据流向的想法。

Dva的框架和由来

一图胜前言，首先我们看下传统的React项目的组件结构是怎么样的：

如果和想要发生联系，则只能通过父组件

来实现，这个方式在页面比较简单的时候还能够胜任，但若项目复杂起来之后，整个页面的数据流向就会变得如下图所示：

在这种情况下对项目进行维护绝对是个灾难，同时对这样的项目进行改动也是很困难的事儿，因为不同组件之间耦合的地方太多了，所以我们需要对state

做额外的管理，于是我们就使用了Redux，那么项目结构就变成了这样：

可以看到这已经把state和处理逻辑从 里面抽取出来了, 原先的add和finish操作也变成了reducer里的函数。因为 及

都是 Pure Component

, 那么通过 connect

方法使这些组件建立起与store 的联系，同时通过 dispatch 向 store 发送 action, 促发 store 的状态进行变化, 一旦状态有变,