属性或方法“foo”未在实例上定义，但在渲染期间被引用答案

【问题标题】：Property or method "foo" is not defined on the instance but referenced during render属性或方法“foo”未在实例上定义，但在渲染期间被引用
【发布时间】：2021-08-05 07:49:33
【问题描述】：

[Vue warn]: Property or method "modelInfo" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.

这是我在获取数据时收到的错误

<template>
  <main>
    {{ modelInfo }}
  </main>
</template>

<script>
import searchByNameQ from '~/apollo/queries/models/searchByNameq'

export default {
  async asyncData({ $strapi }) {

    // Fetch model data
    const modelInfo = await $strapi.graphql({
      query: searchByNameQ.loc.source.body,
      variables: { name: ['Transit Custom'] }
    })

    return {
      modelInfo
    }
  }
}
</script>

在刷新和 nuxt-link 这工作。但是热模块更新会出错。 modelInfo 的输出是：

{
    "models": [{
        "id": "2",
        "name": "Transit Custom",
        "size": "mellem"
    }]
}

编辑：发现错误。这段代码是正确的，但是错误是由nuxt.config中的一个配置引起的

我一直在使用此设置，因为它修复了 Google Analytics（分析）问题。删除此配置后，没有错误。

  features: { transitions: false },

【问题讨论】：

该代码位于哪个文件夹/文件中？
页面位于：pages/_brands/_models/index.vue
热模块更换有时似乎有点问题。我需要经常刷新页面，以确保它不是实际错误。
虽然，如果 moslty 将 v-if="modelInfo" 设置在 main 左右。 modelInfo 一开始没有任何价值......实际上你应该得到一个错误，但是一个不同的错误。试试以防万一
随意发布您自己的答案并接受它。

标签： javascript vue.js nuxt.js

【解决方案1】：

我一直在 nuxt.config 中进行此设置，因为它修复了 Google Analytics 问题。删除此配置后，没有错误。

  features: { transitions: false }

【讨论】：