You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何获取v-data-table-virtual行对应的item数据?

解决Vuetify 3.3.15 v-data-table-virtual行点击传参问题

完全可以实现,不需要使用item插槽。Vuetify的click:row事件本身会自动把当前行对应的users数组中的项作为参数传递给绑定的方法,你只需要调整事件绑定的写法:

修改你的模板代码:

<v-data-table-virtual
  v-model="selectedToDelete"
  :headers="headers"
  :items="users"
  :key="users"
  @click:row="editUser"
/>

如果你需要显式传递参数(比如同时传入其他值),也可以用箭头函数写法:

<v-data-table-virtual
  v-model="selectedToDelete"
  :headers="headers"
  :items="users"
  :key="users"
  @click:row="(item) => editUser(item)"
/>

之后在你的方法中直接接收这个用户对象即可:

function editUser(user) {
  // 在这里处理选中的用户,比如执行编辑逻辑
  console.log('当前点击的用户:', user)
}

这样点击表格行时,editUser方法就能拿到对应的user项了。

内容的提问来源于stack exchange,提问作者Florian

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.11 12:24:16