是否可以在 VueJS 中传递反应属性？

Question

我从另一个开发人员那里接管了一个代码。他使用了一个 Vuex 属性 POLL 来初始化一些组件。我想使用不同的方法——在上层获取对象并将其作为下游属性传递给组件。该对象是从后端以异步方法获取的。我认为 Vue 反应性稍后会初始化实际值。但我得到一个错误：

[Vue warn]: Property or method "poll" 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. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

found in

---> <PollHeading> at src/components/molecules/PollHeading.vue
   <CompletePoll> at src/components/organisms/CompletePoll.vue
     <Home> at src/views/Home.vue

首页.vue

<Poll v-if="this.$store.getters.LATEST_POLL" :item="this.$store.getters.LATEST_POLL" />
... 
created() {
 this.$store.dispatch('GET_LATEST_POLL');
},

CompletePoll.vue

<PollHeading :item="item"/>
... 
props: {
  item: Object,
},

PollHeading.vue

props: {
  item: Object,
},

我是不是走错了方向，而原来的开发者是对的？或者有没有办法解决我的方法？他曾经这样做：

PollHeading.vue（我改名为 CompletePoll.vue）

computed: {
    poll() {
      return {
        poll: this.$store.getters.POLL,
      };
    },

Answer 1

问题 1)

[Vue warn]: Property or method "poll" is not defined on the instance but referenced during render. 表示你在.vue 文件的template 块中声明了这个，但它没有在script's data property or computed 中声明。我没有看到您使用 poll 变量的特定 .vue 文件。

问题 2) 当你在 tmeplate 块中使用变量时，你不应该使用 this 。

所以不要这样：<Poll v-if="this.$store.getters.LATEST_POLL" :item="this.$store.getters.LATEST_POLL" />

写信：<Poll v-if="$store.getters.LATEST_POLL" :item="$store.getters.LATEST_POLL" />

问题 3) https://github.com/literakl/mezinamiridici/blob/master/spa/src/components/molecules/PollHeading.vue 在此文件上，您在 template 中使用 poll，但您没有在任何地方创建该变量。你的道具名称是item 而不是poll。所以将 poll 更改为 item in template 在该文件中的任何位置阻止。