@Sector567

Как по клику изменить стили у конкретного дочернего элемента во vue?

Вот код.
Сейчас при клике на какой либо элемент, меняется стили у всех элементов, а нужно чтобы цвет менялся только у того дочернего элемента, на родителя которого мы кликнули.
  • Вопрос задан
  • 1109 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Если одновременно несколько элементов могут менять свой цвет:

data: () => ({
  items: Array(5).fill(false),
}),

<div class="item" v-for="(n, i) in items">
  <div class="parent" @click="$set(items, i, !n)">
    <div class="child" :class="n ? 'green' : 'red'">{{ i + 1 }}</div>
  </div>
</div>

Если только один:

data: () => ({
  active: null,
}),

<div class="item" v-for="i in 5">
  <div class="parent" @click="active = active === i ? null : i">
    <div class="child" :class="active === i ? 'green' : 'red'">{{ i }}</div>
  </div>
</div>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы