хорошо, это немного сложно объяснить, но я попробую.
У меня есть некоторые компоненты, визуализированные в цикле из массива карт в моем магазине Vuex
<card-base
v-for="(card, i) in cards"
:class="`dashboard-card ${card.hidden ? 'hidden' : ''}`">
обратите внимание на класс в зависимости от card.hidden
, который false onload
сейчас, каждый <card-base>
имеет кнопку (скрыть), которая должна .. ну, спрятать ее.
способ, которым я пытаюсь это сделать: v-btn в базовом компоненте карты получает свойство @click
, которое вызывает метод.
Проблема / Вопрос
Теперь я хочу установить для свойства hidden
выбранной карты значение true.
, конечно,
minimizeDashboardCard() {
console.log(this.hidden)
this.hidden = true
}
не работает, поскольку this
не является фактическим объектом.от Vuex, который обеспечивает реактивные свойства, но только «элемент».если я установил this.hidden = true
, ничего не изменится (кроме console.log, правильно показывающего «true» после первого щелчка)
, но как я могу получить доступ к реальному объекту vuex из this
?как мне получить index , который я хочу отредактировать в моем массиве?Есть ли способ заставить компонент карты "сказать" что-то вроде:
"отправить действие, которое изменяет ME в фактическом массиве vuex"?
как dispatch('hideCard', this)
и это действительно работает?
TLDR
как я могу узнать индекс карты, по которой щелкнули, в массиве, или напрямую нацелиться на нее любым другим способом?есть ли связь между отображаемым элементом и массивом в хранилище, которое его определяет?
Надеюсь, вы поняли мою проблему: D, спасибо!