介绍, handleSetLock (), {
参,这。美元[& # 39;形式# 39;]. validate (valid =祝辞,{
if 才能;(有效),{
这。才能store.commit美元(& # 39;SET_LOCK_PASSWD& # 39;,, this.form.passwd)
,,this.handleLock ()
,,}
})才能
}, , SET_LOCK_PASSWD:,(状态,lockPasswd),=祝辞,{
state.lockPasswd 才能=lockPasswd
setStore({才能
,,名字:& # 39;lockPasswd& # 39;
内容:,state.lockPasswd,才能
类型:才能,& # 39;会话# 39;
})才能
}, , SET_LOCK:,(状态,行动),=祝辞,{
state.isLock 才能=,真的
setStore({才能
,,名字:& # 39;isLock& # 39;
内容:,state.isLock,才能
类型:才能,& # 39;会话# 39;
})才能
}, , if (store.getters.isLock ,,, to.path !==, lockPage), {
下一个({才能
路径:才能lockPage
})才能
NProgress.done才能()
这篇文章将为大家详细讲解有关怎么在Vue项目中添加一个锁屏功能,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。
<强> 1。实现思路
(1)设置锁屏密码
(2)密码存localStorage(本项目已经封装类推的sessionStorage和localStorage)
(3) vuex设置SET_LOCK状态。isLock=true(为真正的是锁屏状态)
(4)在路由里面判断vuex里面的isLock(为真正的锁屏状态不能让用户后退url和自行修改url跳转页面否则可以)
(1)设置锁屏密码
(2)密码存localStorage setStore是自己封装的方法
(3) vuex设置SET_LOCK状态。isLock=true同时存在商店里面
(4)在路由里面判断vuex里面的isLock
关于怎么在Vue项目中添加一个锁屏功能就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看的到。
