脚本宝典收集整理的这篇文章主要介绍了

向dva进军

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

上家公司玩过DVA,后来一直没碰了,现在准备开发转DVA架构了, 重新熟悉下DVA的点~

关于使用DVA我们要明确几个我们需要清楚以下这些内容:

1. 如何创建一个DVA应用?
2. 如何在开发时组织我们的代码结构?
3. 如何build,发布我们的项目?
4. 如何去写组件,样式,数据模型?
5. 如何将数据模型和我们的组件连接?
6. 如何在数据交互后更新state?
7. 如何处理异步逻辑?
8. 如何配置我们的路由?

DVA-CLI安装

npm install dva-cli -g

可以通过dva -v查看版本号。

创建一个DVA应用

dva new myapp --demo

注意: --demo只是用来创建一个demo级别的app,如果想创建一个正常的应用,通过:

dva new myapp
cd myapp
npm start

定义Models

我们首先定义好我们的数据模型,定义好完整的数据模型有三步:

1. design models
2. design components
3. connect models and components

首先我们定义一个数据模型:

app.model({
    namespace: 'count',
    state: {
        record: 0,
        current: 0
    }
})

namespace是一个model staet的全局状态。state是当前model默认的数据。

组件

定义好数据模型后,我们开始写组件,这里推荐使用无状态组件进行编写,因为dva的架构中不需内部state状态。