什么是dva.js?

一个elm-style的轻量级的前端数据流利用框架。 基于： React + redux + redux-saga + react-rotuer + fetch。

特点

• 容易上手，仅6个api
• elm格调：一个新的概念model，由reducers, effects, subscription 组成
• 反对HRM
• 插件零碎：如: 应用dva-loading后，可主动解决loading状态

兼容

IE9及以上

版本

• dva@2.x（2017-9）（2018-10-26 dva@2.4.1，2019-11-21 dva@2.6.0-beta.19） 【react16.8.4】
• dva@1.x（2016-9）

依据dvajs的sorrycc的答复：dva@3在打算中，但优先级不高（2019-10的答复）（不晓得是否曾经开始）

疾速上手

装置应用dva-cli

npm install dva-cli -g
dva -v # 0.10.1 【官网当初举荐应用: create-umi】
dva new dva-demo # 创立新我的项目dva-demo (提醒：曾经被弃用，举荐应用create-umi)
cd dva-demo 
npm start # 启动开发服务器

初始化的我的项目蕴含如下性能：
根本的我的项目初始化目录及文件，开发服务器、构建脚本、数据 mock 服务、代理服务器等。

dva做了什么？

dva提供的性能都在上面代码中实现的：

dva罕用的性能 ：

// 新建实例 
//（见：dva/src/index.js dva-core/drc/index.js） 
const app = dva();

// 连贯model和ui （见：dva/index.js）
import { connect } from 'dva';

// 插件，如dva-loading等
app.use({})；

// model 
app.model(require('./models/example').default)

// router
app.router(require('./router').default);

// 启动利用
// 基于redux的createStore新建了store, 以及用applyMiddleware来解决redux-saga及其他中间件。
app.start('#root');

// app=dva({}) 在dva-core中新建了一个对象
const app = {
// 将reducers和effects增加namespace为前缀
_models: [prefixNamespace({ ...dvaModel })],
_store: null,
_plugin: plugin,
use: plugin.use.bind(plugin),
// 将传入的model用其namespace前缀后，存到_models中
model,
// 启动
start,
};

// 将router存在_router中
app.router = function router(router){
    app._router = router;
};

// app.start()
app.start = function start(container){
   // 解决后面接管到的配置， 而后渲染到container中
   
    if (container) {
      render(container, store, app, app._router);
    }
// 省略...
}

参考

• dvajs指南
• dva概念

)

• umijs指南