Добрый день. Познаю vue, не знаю как сделать изменение кнопки "Читать далее" в цикле. Там теряется контекст this и я в ступоре.
Есть список, который выводит отзывы из массива объектов.
<li class="reviews__item" v-for="review in reviews" :key="review.item">
<div class="reviews__item_header">
<div class="guest-img">
<img :src="require(`../assets/images/for markup/${review.imgSrc.toLowerCase()}.png`)" alt="Фото гостя">
</div>
<div class="header-wrap">
<div class="guest-name">{{ review.guestName }}</div>
<div class="date">{{ review.date }}</div>
</div>
</div>
<p class="reviews__item_text" :class="{ shown: review.isShown }">
{{ review.text }}
</p>
<div class="read-more-btn" @click="review.isShown = !review.isShown">читать дальше</div>
</li>
Без цикла я бы сделал это через к компьютед
btnText: function() {
if (this.review.isShown) {
return 'Свернуть'
}
return 'Читать дальше'
},
, но в цикле, естественно, не выходит из-за потери контекста. Помогите, плиз.
Средний
