Vue_shop总结

登录界面

表单:登录表单的数据绑定对象(:model, v-model)---表单验证规则对象(:rules,prop)

登录和重置:(ref)---重置(调用resetFields函数)--登录(验证和路由跳转,见下图)

Home首页

1.退出键(路由跳转和window.sessionStorage.clear())

2.导航守卫-axios请求拦截预处理(配置完成后Network-Headers-Request查看Authorization)

3.菜单:

页面一加载就创建created

获取数据-储存数据-判断状态码-数据赋值

v-for循环创建菜单

二级图标直接修改,一级图标通过设置图标对象,根据id动态

菜单效果

 点击高亮

:default="activePath"-----@click="saveNavState(‘/‘ +SubItem.path)----activePath:‘‘(数据存储)---

 注意:页面一加载就创建(this.activePath = window.sessionStorage.getItem(‘activePath‘))

用户状态同步更新到数据库

验证规则

每次点击添加用户都需重置表单,设置一个监听对话框关闭的事件

点击按钮,添加新用户,发起请求,关闭对话框,重新获取列表

Vue_shop总结

原文：https://www.cnblogs.com/chz245/p/15209924.html