3***@qq.com
3***@qq.com
  • 发布:2021-12-29 11:48
  • 更新:2022-01-04 17:10
  • 阅读:1052

【报Bug】vue3微信小程序v-for子项@click事件传参有误

分类:uni-app

产品分类: uniapp/小程序/微信

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win10

HBuilderX类型: 正式

HBuilderX版本号: 3.3.3

第三方开发者工具版本号: 1.05.2111300

基础库版本号: 2.21.2

项目创建方式: HBuilderX

示例代码:
复制代码<template>  
  <view class="container">  
    <button class="item" @click="reverse" size="mini">反转数组</button>  
    <view class="item" v-for="item of arr" :key="item._id" @click="show(item)">{{ item.text }}</view>  
    <view>{{ output }}</view>  
  </view>  
</template>  

<script setup>  
import { ref } from 'vue'  

let output = ref('')  
let arr = ref([{ _id: 1, text: 'aaa' }, { _id: 2, text: 'bbb' }, { _id: 3, text: 'ccc' }, { _id: 4, text: 'ddd' }])  
function show(e) {  
  output.value += JSON.stringify(e) + '\r\n'  
}  
function reverse() {  
  arr.value = arr.value.reverse()  
}  
</script>  

<style scoped>  
.item {  
  margin: 20rpx;  
  padding: 20rpx;  
}  
</style>

操作步骤:

1、点击aaa,下方显示aaa
2、点击反转数组
3、点击ddd,下方显示aaa,应显示ddd

预期结果:

@click中的参数应该随数组变化而变化

实际结果:

@click中的参数没有随数组反转而变化

bug描述:

v-for展示item后,点击第一项,显示aaa,然后反转数组,再点击第一项,还是显示aaa,应显示ddd。

2021-12-29 11:48 负责人:DCloud_UNI_LXH 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

稍后修复,临时解决方案,不指定key,或者将key指定为index

DCloud_UNI_FXY

DCloud_UNI_FXY

升级至HBuilderX Alpha 3.3.6

该问题目前已经被锁定, 无法添加新回复

  • 标题 / 粗斜体
  • 代码片段
  • 超链接 / 图片 / 视频
  • 列表 / 引用

文章内容较多时,可以用标题分段 :

## 大标题 
### 小标题

斜体 / 粗体 :

**粗体** 
*斜体*
***粗斜体***

代码片段 :

``` javascript
代码片段
```

超链接 :

[链接文字](链接地址) 例: [百度](http://www.baidu.com)

图片 :

![图片说明](图片地址) 例: ![百度logo](http://www.baidu.com/img/bdlogo.gif)

视频 :

!![视频说明](视频地址) 例: !![优酷视频](http://youku.com)

有序列表 :

1. 123
2. 123
3. 123

无序列表 :

- 123
- 123
- 123

引用 : ( 双回车后结束引用 )

> 引用内容
引用内容
引用内容