如何在 Vuetify 中使用 Dialog 连接表记录

Posted 2023-02-23

【中文标题】如何在 Vuetify 中使用 Dialog 连接表记录

【英文标题】：How to connect table records with Dialog in Vuetify

【发布时间】：2019-01-03 03:49:19

【问题描述】：

如何在 Vuetify 的对话框中从表中获取动态数据。我有数据表

    <td class="text-xs-left"> props.item.id </td>
    <td class="text-xs-left"> props.item.title </td>
    <td class="text-xs-left"> props.item.quantity </td>
    <td class="text-xs-left"> <Dialog :to="'/products/' + props.item.id"></Dialog></td>

我有组件 Dialog.Vue。 如何连接点击打开对话框中的特定记录？

【参考方案1】：

对话框应该放在桌子外面。在表格中，您应该有触发对话框的按钮。以@click="dialog_visible = true" 为例，如果您需要动态对话框，您可以在@click 方法中设置对话框参数。

【讨论】：

这是我的新代码。我删除对话框标签并添加 @click 侦听器。只是我需要表格中的动态数据

您可以将数据作为函数参数传递给对话框。像 Open Dialog 然后在 openDialog 函数中你可以告诉 this.dialog_data = item 并且你可以从对话框中访问选定的元素。