Use umi with dva
1、使用umi-plugin-react配置dva
2、特性:
- 按目录约定注册model,无需手动app.model
- 文件名即namespace,可以省去model导出namespace key
- 无需手写router.js,umi支持model和component按需加载
- 内置query-string,无需手动解码和编码
- 内置dva-loading和dva-immer,其中dva-immer需通过配置开启
- 开箱即用,无需安装额外依赖,dva, dva-loading, dva-immer, path-to-regexp,object-assign,react,react-dom
3、使用
$ yarn add umi-plugin-react
如果你用 npm,执行npm install --save umi-plugin-react
然后在 .umirc.js
里配置插件:
export default {
plugins: [
[
'umi-plugin-react',
{
dva: true,
},
]
],
};
开启 dva-immer 以简化 reducer 编写
4、model注册
model 分两类,一是全局 model,二是页面 model。全局 model 存于 /src/models/
目录,所有页面都可引用;页面 model 不能被其他页面所引用。
+ src + models - g.js + pages + a + models - a.js - b.js + ss - s.js - page.js + c - model.js + d + models - d.js - page.js - page.js
页面组件不刷新是什么原因:
layouts/index.js里如果用了connect,需要umi/withRouter高阶一下
import withRouter from 'umi/withRouter'; export default withRouter(connect(mapStateToProps)(LayoutComponent));
import withRouter from 'umi/withRouter';
export default withRouter(connect()(Layout));
怎么访问store
window.g_app._store
window.g_app._store.dispatch