vue、uniapp项目循环中能显示每个列表的内容,但是点击的时候传递的参数却不正确

介绍

这个问题找了几个小时,赶紧记录一下,以免下次又遇到这个问题了。这件事告诉我们,我们的知识积累是真的很重要,不要太依赖AI,我让AI给我找了半个多小时都没找到问题,推荐的都是一些乱七八糟的方法。

问题是这样的

<view class="card_container" @click="enterPatientDetailA(item)" v-for="(item,index2) in item1.list" :key="item.patientId">

当触发点击事件的时候,这里的item就不正确了。其实原因很简单就是这个key有问题。

因为我这边的数据中,家属与患者都有patientId并且这个id还是一样的。所以导致点击的时候传递的item的值不正确。把这个key改为唯一id就可以了,或者直接用index2即可:key="index2"

我估计其中的原理应该是这样的。

渲染是按正常的渲染,item里的内容都能双向绑定显示出来。

但是当触发点击事件的时候,这个时候vue可能会根据这个key去找数组里的这个item是哪个,然后再传过去。而不是直接从dom里去找。

相关推荐
2501_916007471 天前
深入理解HTTPS对称与非对称加密机制及Charles抓包实践
网络协议·http·ios·小程序·https·uni-app·iphone
小徐_23331 天前
AI 写 wot-ui 总在猜 API?我们把 Skills、MCP 和 CLI 都配好了
前端·uni-app·ai编程
Liu.7741 天前
uni-app 组件 uni-easyinput 常见 Bug 及解决方案
uni-app·bug
小徐_23332 天前
uni-app 项目别再从零搭了!3 个 Wot UI 起手模板怎么选?
前端·uni-app
蜡台2 天前
uniapp pdf文件预览组件
pdf·uni-app·合同·pdfh5
凡泰AI2 天前
如何借助MCP打通企业APP内部服务:从统一调用到小程序承接
小程序·uni-app·app·mpaas·mcp·小程序容器
华玥作者2 天前
uniapp 万条数据不卡顿:我写了个虚拟列表组件 hy-list,原生支持瀑布流
数据结构·uni-app·list·vue3
这是个栗子2 天前
uni-app 微信小程序开发:常用函数总结(一)
微信小程序·小程序·uni-app·getcurrentpages
宠友信息3 天前
消息序号如何保证即时通讯源码聊天记录稳定加载
java·spring boot·redis·python·mysql·uni-app
2501_916008894 天前
苹果上架工具怎么选 不用 Mac 上架 App Store 的几种方案
android·macos·ios·小程序·uni-app·iphone·webview