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

Question

我正在进行nuxt typescript项目。我的中间件在/中间件/重定向.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>

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

遗憾的是，文档并不清晰。点击

Answer 1

您不需要导入也不需要为其提供对象，只需按文档中所示传递名称即可：https://nuxtjs.org/docs/2.x/directory-structure/middleware#named-中间件

这应该足够了

<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
middleware: 'redirect',
data () {
return {}
}
})
</script>