Привет, есть v-data-table где итерируются данные, <template v-slot:body="{items}"> Также для каждого <v-row> есть

Question

Привет, есть v-data-table где итерируются данные, <template v-slot:body="{items}"> Также для каждого <v-row> есть

вложенный template который нужно показывать и прятать нажимая на кнопку.

Сделал массив showResult[item.test_id]

и проставляю там true или false

И пытаюсь отразить
<template v-if="showResult[item.test_id]">

Но похоже, что динамический массив не хочет быть реактивным.

Как сделать это без массива? Или какие еще варианты?

#frontend #javascript #programming #russian #vue.js

0

19.11.2021

2 ответов

20 просмотров

Denys Автор вопроса

Ivan
v-row и его содержимое вынесите в отдельный компон...

Сделал так toggle(id) { const index = this.opened.indexOf(id); if (index > -1) { this.opened.splice(index, 1) } else { this.opened.push(id) } },

0

19.11.2021

Ivan · Accepted Answer

v-row и его содержимое вынесите в отдельный компонент, в этом компоненте добавьте свойство hidden и обрабатывайте клики по кнопке // main component <v-data-table> <my-v-row v-for="(row, index) in rows" :key="index"></my-v-row> </v-data-table> // my-v-row <v-row> <div> <button @click="hidden = !hidden">Click me</button> <div :class="[hidden && 'd-none']">Content here</div> </div> </v-row> <script> export default { data () { return { hidden: false } } } </script>

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

Привет, есть v-data-table где итерируются данные, <template v-slot:body="{items}"> Также для каждого <v-row> есть

2 ответов

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