Vue进阶之Vue项目实战（二）

构建基础框架

路由

路由分类：

1. memoryHistory：内存路由，路由信息记录在内存中，当页面刷新，整个路由记录栈没有了的场景使用内存路由。当做状态用，存在内存中间的历史记录栈。（组件的tabs标签页切换算是内存路由）
2. hashHistory：hash模式，通过触发onhashchange方法来监听URL中hash值的变化
3. browserHistory/webHistory：web模式，通过popstate和pushState监听和触发来改变历史记录栈里的数据
4. 面向ssr的记录模式

区别：跳转路由的方法不一样，监听历史记录栈变更的方法不一样

common-基础封装，负责api协议的约定，在不同端处理实际问题后，在抽象层上一层再做一层封装
hash-
html5-webHistory
memory-memoryHistory

路由

• app 主路由
  • dataSource 数据源
    • :id 动态路由
  • layout 界面组件
  • actions

跟路由相关的组件都放在views，其他普通的组件都放在components中
view：路由组件
components：其他普通组件
blocks：重点组件

项目（ v1.0,base-app-layer）

项目分支：第一个和第二个分支是基础的分支(init project,base-config)，重点

导航 router

• app
  • dataSource 数据源
  • layout 布局
  • actions 动作
• about

怎么实现切换页面后，标签不同颜色的问题？
在AppNavigator.vue组件中：

1. 定义 组件对象，里面包括value，label，bg，color，borderColor属性
2. 使用computed对组件对象处理，获取当前的router.name，来看router.name名称和当前激活的内容匹配上

物料

编排选型

考虑技术选型和方案
例如：

• 拖拽，应用拖拽实现
  • html5的drag和drop实现
  • mousemove事件