1、项目技术栈
-
Vue
-
Vue-Router
-
Element-UI
-
Axios(发起请求)
-
wangeditor(富文本编辑器)
-
Echarts(图形,报表)
2、项目初始化 -
安装Vue脚手架
-
通过脚手架创建项目(建议选择手动配置)
-
配置Vue路由
-
配置Element-UI组件库
-
配置Axios库
-
实现Axios的发装
3、Element-UI全局引入。
import Element from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
一.Api 封装
要把常用的API拆分出去最后导入main.js中就可以了
二. 登陆验证
三. 首页布局
四.用户管理界面主要应用到了
增删改查,还有分页 进行页面渲染
五.角色列表
主要是增删改查。外加一个级联选择器分配权限。
六.权限列表
就是获取数据渲染界面
七.商品列表
商品参数和商品属性直接用级联选择器里的数据 这个级联选择器只能用三级的
八.分类参数
难点主要是 动态参数和静态参数的选择 用一个弹出框
九.商品分类
主要是增加删除 修改 和级联选择器
十.订单管理
使用的npm安装 npm install wangeditor --save
十一.数据统计
首先要下载echarts 然后在引入进你要应用的组件中
然后获取数据 然后在修改一下对应的数据
总结:使用vue框架组件化开发,vuex,路由鉴权,API封装,时间格式化工具,全局自定义变量,全局组件的注册等等