uni-app H5模式下 picker选择器下标返回异常
uni-app H5模式下 picker选择器下标返回异常 产品分类:uniapp/H5
| 属性 | 值 |
|---|---|
| PC开发环境操作系统 | Windows |
| PC开发环境操作系统版本号 | Windows 10 |
| HBuilderX类型 | Alpha |
| HBuilderX版本号 | 3.3.8 |
| 浏览器平台 | Chrome |
| 浏览器版本 | 97.0.4692.71(正式版本) (64 位) |
| 项目创建方式 | HBuilderX |
bug描述:
H5端 手机窗口模式下, 当picker内容超过150个选项时,选中选项,下标(即:e.detail.value)与选中项下标不一致
此问题出现于H5端,包括Chrome 手机窗口模式,手机系统浏览器等环境。APP端未出现该异常
示例代码:
<template>
<view>
<view class="uni-title uni-common-pl">普通选择器</view>
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-left">
当前选择
</view>
<view class="uni-list-cell-db">
<picker @change="bindPickerChange" :value="index" :range="array" range-key="name">
<view class="uni-input">{{array[index].name}}</view>
</picker>
</view>
</view>
</view>
</view>
</template>
<script>
let array=[]
for (var i = 1; i <= 150; i++) {
array.push({
name:'爱你'+ i + '遍'
})
}
export default {
data() {
return {
index:0,
array
}
},
methods: {
bindPickerChange: function(e) {
console.log('picker发送选择改变,携带值为:' + e.detail.value)
this.index = e.detail.value
},
}
}
</script>
<style>
.uni-picker-tips {
font-size: 12px;
color: #666;
margin-bottom: 15px;
padding: 0 15px;
/* text-align: right; */
}
</style>
更多关于uni-app H5模式下 picker选择器下标返回异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html
2 回复
收到,抱歉占用时间,我再检查下本地环境

