下拉框数据被遮挡 且 后续数据无法下拉的 解决方法

前言

小程序使用的是Uniapp,原理都差不多,索性标题就不标注Uniapp(小程序)

对于该问题调试了一个晚上,最终解决,对此记录下来

1. 问题所示

执行下拉框搜索的时候
有如下问题

  1. 下拉框高度不够,一直显示只有两行的数据显示
  2. 之后的数据无法下滑选择,滑不出来

但是数据输出是有的,反而出现如上两个问题

在这里插入图片描述

2. 原理分析

根据问题的提示和最后的解决方法:

  • 调整下拉框高度: 首先,检查下拉框的高度,确保它能够容纳所有的选项
    下拉框的高度不够,可能会导致后面的数据无法滚动到可视区域

  • 检查父级容器样式: 确保设备号下拉框及其后面的数据都位于一个可以滚动的容器中
    可能父级容器的样式或者布局导致了滚动行为的异常

其他的解决方式也可看看:

  • 添加滚动条::下拉框的选项过多,可以考虑添加垂直滚动条,以便用户能够滚动查看所有的选项

  • 检查数据渲染逻辑:确保后面的数据都已经

最近更新

  1. TCP协议是安全的吗?

    2024-06-14 11:02:01       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-06-14 11:02:01       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-06-14 11:02:01       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-06-14 11:02:01       20 阅读

热门阅读

  1. 后端开发面试题5(附答案)

    2024-06-14 11:02:01       5 阅读
  2. 在Spring中如何手动开启事务(使用编程式事务)

    2024-06-14 11:02:01       9 阅读
  3. 【Go】十三、TOKEN机制与跨域处理方式

    2024-06-14 11:02:01       7 阅读
  4. Python类,面向对象详解

    2024-06-14 11:02:01       6 阅读
  5. windows命令帮助大全

    2024-06-14 11:02:01       7 阅读
  6. Codeforces Round 952 (Div. 4)

    2024-06-14 11:02:01       8 阅读
  7. 2024.6.13 刷题总结

    2024-06-14 11:02:01       8 阅读
  8. MySql几十万条数据,同时新增或者修改

    2024-06-14 11:02:01       6 阅读
  9. ELasticSearch数据迁移方案-elasticdump

    2024-06-14 11:02:01       7 阅读
  10. 前端针对需要递增的固定数据

    2024-06-14 11:02:01       5 阅读
  11. 如果用户访问的是没有页面的路由跳转到404

    2024-06-14 11:02:01       6 阅读
  12. Spring源码学习-Resource

    2024-06-14 11:02:01       8 阅读