vue实现登陆登出的实现示例-创新互联
最近接手的B端项目选择了vue来做,此项目使用element ui Message等为组件 望周知
成都网站建设公司更懂你!成都创新互联只做搜索引擎喜欢的网站!成都网站制作前台采用搜索引擎认可的DIV+CSS架构,全站HTML静态,H5高端网站建设+CSS3网站,提供:网站建设,微信开发,微信小程序定制开发,商城网站定制开发,app软件定制开发,空间域名,服务器租售,网站代托管运营,微信公众号代托管运营。需求
- 登陆成功后跳转至首页
- 首页不能手动跳转至登陆页
- 登陆后跳转至目标页面
此次B端SPA项目把ak存在localstorage中
1.登陆的跳转利用全局钩子router.beforeEach
//router.js router.beforeEach((to, from, next) => { // 若userkey不存在并且前往页面不是登陆页面,进入登陆 // 若userkey存在并且前往登陆页面,进入主页 const userKey = localStorage.getItem('userKey') if (!userKey && to.path !== '/login') { next({ path: '/login', query: { redirect: to.fullPath } }) } else if (userKey && to.path === '/login') { next({ path: '/' }) } else { next() } })
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
网页题目:vue实现登陆登出的实现示例-创新互联
分享地址:http://scyanting.com/article/ehoop.html