1***@qq.com

发布：2024-10-23 16:25
更新：2025-05-17 12:31
阅读：321

【报Bug】uni-data-picker组件，弹出的窗口顶部距离第一条数据有一片空白

分类：uni-app

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

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： 19044.1766

第三方开发者工具版本号： wechat_devtools_1.06.2409140_win32_x64

基础库版本号： 3.6.1

项目创建方式： CLI

CLI版本号： 3.2.47

操作步骤：

直接使用了官方文件

view>  
      <uni-data-picker :localdata="items" popup-title="请选择班级"></uni-data-picker>  
    </view>  

<script setup>  
let items = ref([  
  {  
    text: '一年级',  
    value: '1-0',  
    children: [  
      {  
        text: '1.1班',  
        value: '1-1',  
      },  
      {  
        text: '1.2班',  
        value: '1-2',  
      },  
    ],  
  },  
  {  
    text: '二年级',  
    value: '2-0',  
  },  
  {  
    text: '三年级',  
    value: '3-0',  
  },  
])  
<.script>

预期结果：

正常显示

实际结果：

空白太大

bug描述：

uni-data-picker组件，弹出的窗口顶部距离第一条数据有一片空白，怎么解决

2024-10-23 16:25 负责人:无分享

4 个回复

DCloud_UNI_yuhe

你好，你这是在微信小程序上出现的问题吗？我这里测试的没有发现这个问题

能否提供一下更多信息？另外可能存在如果 value 的值重复可能会出现这个情况，你看一下你的代码。

1***@qq.com (作者)

是的，微信小程序

<template>  

  <view>  

    <uni-data-picker  

      :localdata="items"  

      popup-title="请选择班级"  

      @change="onchange"  

      @nodeclick="onnodeclick"  

    ></uni-data-picker>  

  </view>  

</template>  



<script>  

export default {  

  data() {  

    return {  

      items: [  

        {  

          text: '一年级',  

          value: '1-0',  

          children: [  

            {  

              text: '1.1班',  

              value: '1-1',  

            },  

            {  

              text: '1.2班',  

              value: '1-2',  

            },  

          ],  

        },  

        {  

          text: '二年级',  

          value: '2-0',  

        },  

        {  

          text: '三年级',  

          value: '3-0',  

        },  

      ],  

    }  

  },  

  methods: {  

    onchange(e) {  

      const value = e.detail.value  

    },  

    onnodeclick(node) {},  

  },  

}  

</script>

2024-10-23 16:49

DCloud_UNI_yuhe

回复 1***@qq.com: 没问题啊我这里测试的，你尝试一下更新一下组件看看。

2024-10-23 16:57
1***@qq.com (作者)

回复 DCloud_UNI_yuhe: 升级了，"@dcloudio/uni-ui": "^1.5.6"

scroll-view的class=selected-area导致的

但是这个类是uni-daate-picker组件内部的，要怎么去掉呢

2024-10-23 17:15

1***@qq.com (作者)

可以看下是这个scroll-view的class=selected-area导致的

DCloud_UNI_yuhe

并不是这个问题导致的，你看一下你页面中是否有其它影响的呢？

j***@126.com

我也遇到同样的问题，搞了半天没解决，最后只能重写样式了，为了避免别人再走这样的弯路，贴出来我的代码
.uni-data-tree .uni-data-tree-dialog .uni-data-pickerview scroll-view {
flex: none;
height: auto ;
}

要回复问题请先登录或注册

【报Bug】uni-data-picker组件，弹出的窗口顶部距离第一条数据有一片空白

预期结果：

正常显示

实际结果：

空白太大

bug描述：

4 个回复

公告

相关问题

【报Bug】uni-data-picker组件，弹出的窗口顶部距离第一条数据有一片空白

预期结果： 正常显示

实际结果： 空白太大

bug描述：

与内容相关的链接

4 个回复

公告

相关问题

预期结果：

正常显示

实际结果：

空白太大