单击另一个 | 在 DOM Vue js 中查找元素浏览器

Question

我遇到困难的问题是这个。 当在一行数据中单击一个按钮时table 我想让同一行中只出现一个按钮。 image 1

在这种情况下，必须在单击 + 或 - 按钮时打开该行的输入。

image 2

我不能将 v-if 与通用 is_visible class 设置为 true，否则整个 table 的所有输入都会打开。

执行此操作的准确正确方法是什么。在 Jquery 中，我对所选按钮使用 $this 轻松获得了相同的结果？

Answer 1

我希望在单击按钮时显示该行的输入。这是单行代码

<td class=" p-2 d-flex">
                            <v-btn
                                class="mx-2"
                                fab
                                dark
                                small
                                color="primary"
                                @click="showTextField()"
                            >
                                <v-icon dark>
                                    mdi-plus
                                </v-icon>
                            </v-btn>
                            <v-btn
                                @click="showTextField()"
                                class="mx-2"
                                fab
                                dark
                                small
                                color="primary"
                            >
                                <v-icon dark>
                                    mdi-minus
                                </v-icon>
                            </v-btn>


                                <v-text-field
                                    class="mr-2 d-none"
                                    label="Quantity"
                                    type="number"
                                    required>
                                </v-text-field>

   </td>