Nuxt.js

Middleware 會在一個頁面或一群頁面render之前執行的程式。

例如驗證使用者權限之類的功能，就會以middleware的方式來處理。

middleware會接收到一個context的變數作為第一個參數，關於context 裡面有key，可參考這裡。

middleware被執行的順序如下：

1. nuxt.config.js
2. 符合的 layout
3. 符合的 page

以下是參考範例
先在middleware裡面建立要執行的程式，檔名會自動可成為被呼叫的名稱

middleware/stats.js

import axios from 'axios'

export default function ({ route }) {
  return axios.post('http://my-stats-api.com', {
    url: route.fullPath
  })
}

nuxt.config.js

說明文件：https://nuxtjs.org/guide/routing

基本概念：只要在 pages 目錄及子目錄中，建立相關的index.vue檔，就會自動生成對應的route

例如

pages/
--| user/
-----| index.vue
-----| one.vue
--| index.vue

就可以產生  三個 route，分別是  "/" ,  "/user",  "/user/one"

要建立動態路由也滿簡單的，就是在vue檔，加上 下底線 "_" 的前綴 ，如

pages/
--| _slug/
-----| comments.vue
-----| index.vue
--| users/
-----| _id.vue
--| index.vue

以上範例中，有三個動態路由，分別是  "/{slug}/" ， "/{slug}/comments" 與 "users/{id}"

說明文件：https://nuxtjs.org/guide/configuration

nuxt.config.js 的內容大概長這樣