Javascript 如何在modal中使用VueJS复制当前行的数据？

我目前正在为我的项目使用vuejs。我需要的是，当我单击表中的一行时，一个模态将根据单击的行中的数据显示并填写表单。但是，我的代码不适用于它。请看下面我的代码

var-app=新的Vue({
el:“#roleContainer”，
数据：{
角色：[
{显示名称：'user'，说明：'user'，创建于：'2020/02/20'}，
{显示名称：'mod'，说明：'mod'，创建于：'2020/02/21'}
],
id:“”，
显示\u名称：“”，
说明：“”
},
方法：{
openEditModal（角色）{
$（'formModal'）.modal（'show'）；
console.log（角色）；
}
}
})

显示名称
描述
创建于
&时代；
创建角色
显示名称
描述
取消
拯救

当您使用Vue指令时，表达式是在Vue上下文中计算的，因此您不需要在

{}

中包装内容

@click

只是

v-on:click

指令的简写，因此同样的规则也适用

在您的情况下，只需使用

@click=“addToCount（item.contactID）”

用这个替换你的桌子

  <tbody>
    <tr v-for="role in roles" @click="openEditModal(role)" class="pointer">
        <td v-text="role.display_name"></td>
        <td v-text="role.description"></td>
        <td v-text="role.created_at"></td>
    </tr>
  </tbody>

然后，在openEditModal函数中

this.display_name = role.display_name;
this.description = role.description;

---

我希望它对您有帮助

这是正确的，但我只需要从

display\u name

编辑到

This.display\u name

。也请更新。

@click="openEditModal(role)"

this.display_name = role.display_name;
this.description = role.description;