Невозможно использовать $ fetchState в Nuxt 2.12 - PullRequest
0 голосов
/ 07 мая 2020

Итак, я пытаюсь использовать новую функциональность, описанную в документации.

Однако я получаю следующую ошибку:

Свойство или метод «$ fetchState» не определен в экземпляре, но на него ссылаются во время рендеринга.

Хотя мой компонент четко определяет метод fetch (), и мне удается что-то от него извлечь.

<template>
    <div v-if="$fetchState">
        <p v-if="$fetchState.pending">Fetching posts...</p>
        <p v-else-if="$fetchState.error">Error while fetching posts</p>
        <div v-else>
            <div v-if="content.content1" v-html="content.content1" />
            <div v-if="content.content2" v-html="content.content2" />
        </div>
    </div>
</template>
<script>
import { mapState } from 'vuex'

export default {
    async fetch({ store, error }) {
        try {
            await store.dispatch('home/fetchContent')
        } catch (e) {
            error({
                statusCode: 503,
                message: 'Unable to fetch'
            })
        }
    },
    computed: mapState({
        content: (state) => state.home.content
    })
}
</script>

Кто-нибудь сталкивался с этим раньше?

1 Ответ

2 голосов
/ 13 мая 2020

Когда вы используете fetch (context), вы используете старую fetch, вы должны получить из этого контекст, если вам нужно.

  async fetch() {
    const { store, error } = this.$nuxt.context

    try {
      await store.dispatch('home/fetchContent')
    } catch (e) {
      error({
        statusCode: 503,
        message: 'Unable to fetch'
      })
    }
  },

https://nuxtjs.org/blog/understanding-how-fetch-works-in-nuxt-2-12/#fetch -before-nuxt-2- 12

...