本文主要是介绍美食街项目登录-注册-退出,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
效果参照图如下:
不好意思因为内容过多,不能单独给大家分解 一一说明
发的代码图,里面代码我每个都备注了意思和一些拓展知识,大家慢慢参考(#^.^#)!!!
有需要代码可以评论我会给你传一份哒 (*^▽^*)
1)未登录和未注册页面效果
2)当注册或登录了时,效果图
效果要求: 1)路由栅栏效果 实现有些页面需要登录才能进入页面 2)实现登录和注册的效果 3)登录了时按退出效果
一.路由设置栅栏
ps: ! -----这时候如果页面需要登录的话就会调转到index.vue的末班中
二.路由登录写完了,我们来看看登录和注册的效果吧
a.设置一总组件,用于控制登录和注册的页面切换
a-1.登录组件
已知数据:
!!!! 登录组件
a-2:注册页面
已知数据:
!!!!!注册组件:
三.退出按钮效果
ps:已知登录和注册已完成,看图三效果图的右上角的退出按钮,实现他的效果
已知登录后的token值我们存储到了vuex 中:
ps: 这时候我们只需要操作退出按钮就好了,给按钮添加单击事件
已知数据:
!!! 处理点击退出事件:
今天的效果就此结束了(●'◡'●)
欢迎来探讨你的不懂,看到我会一一解答的哦 OK(ゝω・´★)!!!
感谢您的浏览(♡ ὅ ◡ ὅ )ʃ♡ 嘻嘻
这篇关于美食街项目登录-注册-退出的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!