nuxt中路由跳转

Question

问题描述：

我想在封装的axios里面的拦截器引用router，当用户没有登录的时候，使用router.push({path:"/login"})跳转到登录界面，但是此时显示router  undefined，我应该怎么导入router呢，import试过了不可以，希望大佬们能给予解答，thanks

Answer 1

nuxt里使用路由拦截直接使用router.beforeEach或者使用组件独享守卫，都会有刷新白屏的问题。

用中间件是正确解决方法，支持异步操作。
在需要鉴权的页面添加配置项：
middleware: 'auth',

在middleware文件夹里添加auth中间件，进行相应拦截即可。
我的个人博客站点是用nuxt写的，管理员页面就用了一个拦截：
https://github.com/Lushenggan...
我的业务是，非管理员登陆进入管理页面则跳到首页：

import { checkAdmin } from '@/api/user'

export default ({ redirect }) => {
  return checkAdmin().then(res => {
    if (res.status !== 200 || !res.data.admin) {
      redirect('/')
    }
  }).catch(() => {
    redirect('/')
  })
}

Answer 2

建议改用middleware，参考：
nuxt文档
参考代码：

export default function ({ store, redirect }) {
  // If the user is not authenticated
  if (!store.state.authenticated) {
    return redirect('/login')
  }
}

middleware文档