vue2.x小项目（vuex应用）

vue2.x小项目（vuex应用）

vue + vue-router + vuex + Element-ui + axios

安装依赖

1.vue-router
2.vuex
3.axios
4.element-ui

项目初始化

删除无用的组件
配置css初始化

编程式导航跳转路由 控制台报错

解决方法：降低vue-router版本
“vue-router”: “^3.5.1”,
“vue-router”: “^3.0.7”,(推荐安装)
安装：npm i vue-router@3.0.7 -S --force

Element-ui

1. element-ui库 使用的scss 写的样式
2. 安装element的时候选择：是否覆盖element css样式？
   y/n 重新生成css
3. 自定义主题色
   1.安装element的时候选择 覆盖scss文件 默认修改element样式
   2.根目录下配置：element-variables.scss
   3.在入口文件导入样式：import ‘./element-variables.scss’
   4.方法二：主题—修改—下载— 导入

后台服务实现

1.node.js express mysql
2.后台返回token：jsonwebtaken
步骤：

1. 创建服务器：端口号3434
2. nodemon ./index.js
3. 路由
   4.jsonwebtaken插件生成token npm i jsonwebtoken -S
   5.token语法：
   1.引入jsonwebtoken
   2.jwt.sign()
   6.特殊情况：后台返回的数据字段只有token字段 没有用户名账号 解析token字段
   1.npm i jwt-decode -S
   2.语法：const decode = jwtDecode(token)

轮播

1.element-ui里面的走马灯
2.swiper 轮播
npm i swiper@5.x vue–xx-swiper