Добрый день, а не поможете? В общем такая ситуация

Question

Добрый день, а не поможете? В общем такая ситуация

вот что делаю на странице

async mounted() {
await this.fetchSomething();
},

methods: {
async fetchSomething() {
this.aboutContent = await this.$axios.$get('/pageInfo?page=about');
console.log(this.aboutContent);
return this.aboutContent;
},
}
в консольке объект с данными все приходит с api.

в разметке делаю так aboutContent есть в data объявлен как пустой объект.
<company-info class="about__companyInfo" :aboutContent="aboutContent"/>
<our-values class="about__ourValues" :aboutContent="aboutContent"/>
в общем такое дело в компонент company-info все ок, вывожу данные
<div class="companyInfo">
<div class="container">
<h1 class="companyInfo__title">{{aboutContent.h1}}</h1>
<div class="companyInfo__textContent" v-html="aboutContent.text">
</div>
</div>
</div>
а вот в компоненте ourValues
<div class="ourValues">
<div class="container">
<h2 class="ourValues__title">{{aboutContent.values.title}}</h2>
<ul class="ourValues__list">
<li class="ourValues__item" v-for="value in aboutContent.values.items">{{value}}</li>
</ul>
</div>
</div>
пишет Cannot read property 'title' of undefined
Не понимаю почему так происходит

#nuxt.js #programming #russian #software

0

05.02.2020

1 ответов

11 просмотров

Denis Strokov · Accepted Answer

у тебя видимо в момент первого рендера еще не заполнено aboutContent и иже с ним values, объяви структуру объекта полностью или сверху навесь v-if который будет проверять что-то в стиле aboutContent !== null чтобы разметка даже не рендерилась, пока данных нету

207 похожих чатов

Добрый день, а не поможете? В общем такая ситуация

1 ответов

Похожие вопросы