Можно ли передать реактивное свойство в VueJS? - PullRequest
0 голосов
/ 29 марта 2020

Есть код, который я перенял у другого разработчика. Он использовал свойство POLL Vuex для инициализации некоторых компонентов. Я хотел использовать другой подход - получить объект на верхнем уровне и передать его как свойство вниз по течению к компонентам. Объект извлекается из метода asyn c из серверной части. Я думал, что 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

Home. 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,
},

Я иду в неправильном направлении, и первоначальный разработчик был прав? Или есть способ как исправить мой подход? Он делал:

Заголовок опроса. vue (я переименовал в CompletePoll. vue)

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

1 Ответ

1 голос
/ 29 марта 2020

Проблема 1)

[Vue warn]: Property or method "poll" is not defined on the instance but referenced during render. означает, что вы объявили это в блоке template файла .vue, но не объявлено в script's data property or computed. Я не вижу указанного файла c .vue, в котором вы используете переменную poll.

Задача 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 вкл этот файл вы используете poll в template, но эта переменная нигде не создана. имя вашей опоры item, а не poll. Поэтому измените poll на item в template блоке везде в этом файле.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...