将中间件添加到 nuxt-typescript 项目中的页面

Question

我正在开发 nuxt-typescript 项目。我在 /middleware/redirect.ts 中的中间件：

import { Middleware } from '@nuxt/types'

const redirect: Middleware = (context) => {
  console.log(context)
}

export default redirect

并像这样添加到 index.veu 页面：

<script lang="ts">
import Vue from 'vue'
import redirect from '~/middleware/redirect'

export default Vue.extend({
  middleware: [redirect],
  data () {
    return {}
  }
})
</script>

但它不起作用，我得到错误。 有什么解决办法吗？

不幸的是，文档不清楚。 click

Answer 1

你不需要导入也不需要给它一个对象，只需传递文档中显示的名称：https://nuxtjs.org/docs/2.x/directory-structure/middleware#named-middleware

应该够了

<script lang="ts">
import Vue from 'vue'

export default Vue.extend({
  middleware: 'redirect',
  data () {
    return {}
  }
})
</script>