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

标签 vue.js vuetify.js

<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-dialog。如何将上述对话框标记的激活器设置为数据表行?目前,只有当我单击 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>

最佳答案

您可以将传递给对话框以使其处于事件状态:

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

</v-dialog>

我想您在 changeSelectedVariable 函数中更改了 currentSelection 的值

关于vue.js - VueJS Vuetify 如何从单击的表行中触发激活器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52720305/

相关文章:

vue.js - 使用槽范围问题 "Cannot read property ' column_name' of undefined 的元素 UI 表列

javascript - 从 html 文件加载 HTML 到 Vue div

vue.js - 为什么我得到 "cannot find module"我已经尝试了很多解决方案

vue.js - 使用 Axios 在 Vuetify v-data-table 中不显示 JSON 数据

javascript - 如何重用 Vue 和 Vuetify 代码?

css - 如何在 vuetify 中堆叠复选框和图标

javascript - VUE CLI - 如何导入脚本和样式

vue.js - Vue 如何将多个 props 从父组件传递到子组件

vue.js - Vuetify数据表,显示展开的行而不显示列

vuetify.js - 如何在 Vuetify 中制作带有多个图像的轮播?