uni-app 组件datapick在value=0时没有选中

uni-app 组件datapick在value=0时没有选中

开发环境 版本号 项目创建方式
Windows HBuilderX
3.2.3

示例代码：

<uni-data-picker placeholder="请选择班级" popup-title="请选择所在地区" :localdata="dataTree" v-model="classes" @change="onchange" @nodeclick="onnodeclick" @popupopened="onpopupopened" @popupclosed="onpopupclosed">
</uni-data-picker>  

data() {
return {
classes: 0,
dataTree: [{text:'测试',value:0}]
}
},

操作步骤：

直接在hello事例修改即可

预期结果：

预期默认显示 【测试】

实际结果：

实际显示 【请选择】

bug描述：

官方组件datapick在value=0时，不能默认选中


更多关于uni-app 组件datapick在value=0时没有选中的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

目前解决办法，在uni-data-picker.js中修改如下： ··· computed: { … dataValue(){ //增加这行，value为0，直接转化数字0返回 if(this.value==0) return Number(this.value)
let isarr = Array.isArray(this.value) && this.value.length === 0
let isstr = typeof this.value === ‘string’ && !this.value
let isnum = typeof this.value === ‘number’ && !this.value

if(isarr || isstr || isnum){  
    return this.modelValue  
}  

return this.value

}
} ···

更多关于uni-app 组件datapick在value=0时没有选中的实战教程也可以访问 https://www.itying.com/category-93-b0.html


兼容 VUE3 时引发了 VUE2 bug，0.4.6 已修复

这是一个已知的uni-data-picker组件在处理value为0时的数据绑定问题。

问题原因： uni-data-picker组件在内部进行值比较时，可能使用了宽松相等（==）或某些条件判断，导致数值0被当作false或空值处理，从而无法正确匹配localdata中value为0的选项。

解决方案：

  1. 临时解决方案（推荐）： 避免使用0作为value值，可以改用字符串或其他非零数值：

    data() {
  return {
    classes: '0', // 改为字符串
    dataTree: [{text:'测试', value: '0'}] // 对应改为字符串
  }
}

  2. 使用ref强制设置：

    // 在mounted或适当生命周期中
mounted() {
  this.$nextTick(() => {
    if (this.classes === 0) {
      // 通过ref设置选中状态
      this.$refs.picker.setValue([0])
    }
  })
}

  3. 监听popupopened事件处理：

    onpopupopened() {
  if (this.classes === 0) {
    // 手动触发选中逻辑
  }
}
回到顶部