DVA介绍

1.名称由来

D.Va拥有一部强大的机甲,它具有两台全自动的近距离聚变机炮、可以使机甲飞跃敌人或障碍物的推进器、 还有可以抵御来自正面的远程攻击的防御矩阵

___来自守望先锋

2.DVA是什么?

DVA是一个轻量级的应用框架

3.开发团队

支付宝开发团队
DVA应用创建
$ npm install dva-cli -g
$ dva new app
$ cd app
$ yarn start

4. DVA项目内容介绍

  1. 目录介绍
    ├── mock mock模拟数据
    ├── node_modules 所有的依赖安装的目录
    ├── editorconfig 项目编辑器配置记录文件
    ├── eslintrc eslint代码检测配置文件
    ├── .gitignore git上传忽略性配置文件
    ├── .webpackrc webpack配置文件
    ├── package.json 项目依赖配置记录文件 、 记录项目脚本命令
    ├── public 静态公共目录( 生产环境 ) 不会被webpack编译
    └── src 开发用的源代码目录
    └──── index.js 项目入口文件
    └──── index.css 项目全局样式
    └──── router.js 项目路由配置
    └──── App.css 是App组件的样式文件
    └──── App.test.js 是App组件测试文件
    └──── logo.svg 初始项目的界面logo
    └──── serverWorker 内部文件,我们不操作
    └──── assets 开发环境下的静态资源文件夹,会被 wepback 编译
    └──── components 组件存放目录
    └──── model redux
    └──── services 数据请求
    └──────── example.js exmaple组件中的数据请求
    └──── routes 路由对应的组件
    └──────── index.js 项目默认页面
    └──── utils 项目封装库
    └─────── request.js 封装fetch数据请求

</div>

  1. 项目解读
    1. 先查看 package.json 文件,通过npm脚本来确定项目启动命令 - 通过roadhog来启动项目
    2. 在查看项目入口文件 src/index.js
      • 确定了redux引入的形式
      • 确定了路由的引用
    3. 查看路由的配置 router.js
    4. 查看路由配置对应渲染的组件
    5. 查看状态共享的redux如何使用

results matching ""

    No results matching ""