web-dev-qa-db-ja.com

nuxt.jsでグローバルルーター機能を作成する方法

Nuxt.jsでVue.jsを使用していますが、ルーターの機能に問題があります。

純粋なVueでは、次のようにmain.jsで書くことができます。

val route = new Router({
   routes:{
      [...]
   }
})

route.beforeEach(to,from,next){
    //do something to validate
}

そして、nuxt.jsで同じことを行う方法は？ main.jsのようなファイルが見つかりません。

また、私が知っているのは、ルーターを実現するためにpagesフォルダーを処理することだけで、リダイレクトパスを設定できません。

助けてください、thx :)

vue.jsvue-routernuxt.js
9
Jacky Wong

Nuxtのプラグインを作成できます

plugins/route.jsファイルを作成します：

export default ({ app }) => {
   // Every time the route changes (fired on initialization too)
   app.router.afterEach((to, from) => {
     //do something to validate
   }
}

nuxt.config.jsファイルを更新します。

plugins: ['~/plugins/route']

Nuxtプラグインの詳細： https://nuxtjs.org/guide/plugins

15
Nicolas Pennec

誰かがまだ興味を持っているかもしれない場合は、次のようにnuxt.config.jsでグローバルミドルウェアをセットアップすることができます。

router: { middleware: ['foo'] },

次に、middleware/foo.jsで何でもします...

export default function({ route, from, store, redirect }) {}
2
xpuu