vue-router来控制用户登录权限
<h1><strong><span style="font-size: 15px">第一步：新建一个名字为permission的js文件，代码如下</span></strong></h1><div class="cnblogs_code">
<pre><span style="font-size: 15px">import router from './router'<span style="color: rgba(0, 0, 0, 1)">
import NProgress from </span>'nprogress' <span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> Progress 进度条</span>
import 'nprogress/nprogress.css'<span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> Progress 进度条样式</span>
<span style="color: rgba(0, 0, 0, 1)">
router.beforeEach((to, from, next) </span>=><span style="color: rgba(0, 0, 0, 1)"> {
NProgress.start(); </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 开启Progress</span>
<span style="color: rgba(0, 0, 255, 1)">if</span> (sessionStorage.getItem('accessToken'<span style="color: rgba(0, 0, 0, 1)">)) {
next()
} </span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)"> {
</span><span style="color: rgba(0, 0, 255, 1)">if</span> (to.path ==="/login"|| to.path ==='/register'<span style="color: rgba(0, 0, 0, 1)">){
next()
}</span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)"> {
next(</span>'/login'<span style="color: rgba(0, 0, 0, 1)">)
}
NProgress.done()
}
});
router.afterEach(() </span>=><span style="color: rgba(0, 0, 0, 1)"> {
NProgress.done() </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 结束Progress</span>
});</span></pre>
</div>
<h1><span style="font-size: 15px">第二步：在main.js中导入permission.js</span></h1>
<div class="cnblogs_code">
<pre><span style="font-size: 15px">import './permission' <span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)">权限</span></span></pre>
</div>
<p><span style="font-size: 15px"> </span></p><br><br>
来源：https://www.cnblogs.com/smile-fanyin/p/16636745.html
頁:
[1]