前端实现登录登出界面
写在前面
前端部分就不想废太多时间了,总结一下干了什么然后去和历史节点一一对照看下就行了。
-
实现两个页面–登陆、注册的前端样式
-
在 router 目录下的
index.js中加入路径 -
在 store 下的
user.js存储用户信息 -
把 user 加入到全局 module
-
在
user.js中利用ajax实现登录。为了方便,在user.js中添加辅助函数login,并在UserAccountLoginView.vue中实现 -
修改
NavBar.vue,将内容和变量绑定起来 -
实现:用户名和密码输入正确,点击提交跳到主页面。在
UserAccountLoginView.vue中实现 -
实现: 登陆成功后获取用户的信息。在
user.js中添加辅助函数,并在UserAccountLoginView.vue中实现 -
实现:登录成功后修改导航栏信息。修改
NavBar.vue。利用v-if和v-else来实现。 -
实现:退出登录。具体逻辑就是把用户存储的token令牌删掉并更改导航栏。修改
NavBar.vue,并在user.js中添加辅助函数来清空token令牌。
改动历史
此文章版权归金晖のBlog所有,如有转载,请注明来自原作者
评论






