Vue Nuxt Auth включить аутентификацию промежуточного программного обеспечения для каждого маршрута с использованием компонентов класса

#javascript #vue.js #vue-component #nuxt.js #vue-class-components

#javascript #vue.js #vue-component #nuxt.js #vue-class-components

Вопрос:

Как я могу включить аутентификацию промежуточного программного обеспечения для каждого маршрута с использованием компонентов класса?

Что эквивалентно этому:

 <script>
  export default {
    middleware: 'auth'
  }
</script>
  

Это не работает:

 <script>
  import { Vue, Component } from 'nuxt-property-decorator'

  @Component
  export default class Profile extends Vue {
    middleware = 'auth'
  }
</script>
  

Ответ №1:

Вам нужно добавить его в качестве параметра в Component декораторе.

 
<script lang="ts">
import { Component, Vue } from 'nuxt-property-decorator';

@Component({
  middleware: ['auth']
})
export default class Profile extends Vue {
  name = 'some data'
}
</script>
  

То, что вы сделали изначально, создаст только свойство данных. Чтобы добавить параметр, специфичный для компонента, помимо параметров Vue, таких как data computed methods и hooks , вы должны передать его как параметр в @Component декораторе

Подробнее об этом читайте здесь