点击红色按钮
点击绿色按钮
objcat
- 发布：2020-06-03 14:15
- 更新：2020-06-03 14:15
- 阅读：762
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 10.15.4
HBuilderX类型： 正式
HBuilderX版本号： 2.7.9
手机系统： iOS
手机系统版本号： iOS 13.4
手机厂商： 苹果
手机机型： 6s
页面类型： vue
打包方式： 云端
项目创建方式： HBuilderX
操作步骤：
预期结果：
红色按钮打印相对应数字
绿色按钮打印相对应数字
红色按钮打印相对应数字
绿色按钮打印相对应数字
实际结果：
红色按钮打印 undefined
红色按钮打印 相对应数字
红色按钮打印 undefined
红色按钮打印 相对应数字
bug描述：
代码提示中默认的v-for是带一个:key="item.id"如果这个id不存在, 则编译到微信小程序上会造成列表方法数据传递失效, 失效的数据就是下面的item, 点击红色按钮会打印undefined, 绿色按钮会打印相对应的数字, 除了微信小程序端 iOS端和网页均正常
<template>
<view class="content">
<button v-for="item in list" :key="item.id" style="background-color: red;" @click="btn_click(item)">
{{ item }}
</button>
<button v-for="item in list" style="background-color: green;" @click="btn_click(item)">
{{ item }}
</button>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello',
list: [1, 2, 3, 5, 6]
}
},
onLoad() {
},
methods: {
btn_click: function(item) {
console.log(item);
}
}
}
</script>
