时间戳

首页 > 解决方案 > VueJS Vuetify 如何从单击的表行中触发激活器

vue.js - VueJS Vuetify 如何从单击的表行中触发激活器

问题描述

<v-dialog v-if="currentSelection != null" persisten t max-width="500px">
  <v-btn slot="activator" @click.native.stop="true" color="primary" dark>Accept
    <v-icon dark right>check_circle</v-icon>
  </v-btn>
  ....
</v-dialog>

单击数据表行时，我试图弹出一个 v 对话框。如何将上述对话框标签的激活器设置为数据表行？目前，它仅在我单击 v-dialog 标记之间的“接受”按钮时才会弹出。感谢您的关注。我现在是前端的新手。

<v-data-table
    :headers="headers"
    :items="xxx"
    :pagination.sync="dataTableOptions.pagination"
    :total-items="dataTableOptions.totalItems"
    :loading="dataTableOptions.loading"
    class="elevation-1">
  <template slot="items" slot-scope="props">
    <tr @click="changeSelectedVariable(props.item)">
      <td>{{ props.item.group.description }}</td>
      <td>{{ props.item.key }}</td>
      <td>{{ props.item.value }}</td>
    </tr>
  </template>
</v-data-table>

标签： vue.jsvuetify.js

解决方案

您可以传递value给对话框以使其处于活动状态：

<v-dialog :value="!!currentSelection" persistent max-width="500px">

</v-dialog>

我想你改变currentSelection了changeSelectedVariable函数的值

推荐阅读