前端Day22 - Vue基础Day6

1.练习1，

数学题

目标: 随机产生 5道 数学题, 输入答案提交后, 在下面对应序号显示结果

说明：

1. 随机指的是两个加法数字随机
2. 点击提交后，下面【对应序号】中需要展示结果
   • 未完成
   • 回答正确
   • 回答错误

2.练习2，

用户订单的物流信息

你正在为一家电商网站开发一个物流信息追踪组件，该组件可以显示用户订单的物流信息， 包括当前物流状态、物流公司名称、物流单号等。要求组件支持以下功能：

1. 通过传入订单号，向后端请求该订单的物流信息 ==> 现阶段可以利用 定时器模拟后端返回数据
2. 查询结果可以由拆分成两个组件==> 1. 商品组件 2. 物流组件
3. 商品组件 ==> 商品描述这一块 要求可以支持自定义 ==> 插槽
4. 物流组件 ==> 当前物流是的状态是由字段：logisticsStatus: 2, // 0 未发货 1 已发货 2 已签收 3 未签收 ==> 做到不同的状态 颜色是不一样的
5. 物流组件里的查看详情按钮 ==> 不是所有人都可以点击，只要 admin``zhangsan``lisi可以查看 ===> 通过自定义指令，实现一个简单的权限判断

3.路由入门

• 单页应用程序 --- spa：如网易云音乐
• 路由 --- 古代管理spa的神
• VueRouter的基本使用 --- 进阶

4..声明式导航

• 导航链接 --- vue-route自带的组件router-link，用于代替a链接
• 路由接口封装 --- 放在单独的view同级文件夹router的index.js中，用@绝对路径配置路径
• 两个类名的改变与使用 --- linkActiveClass与linkExactActuveClass的区别和在router/index.js中改变类名