uni-app 不显示位置列表

uni-app 不显示位置列表

示例代码:

uni.chooseLocation()

操作步骤:

在h5直接点击选择地址
服务端返回地址列表
在页面中有地址列表的这些元素
但是没有显示
去掉某些样式后可以显示```

## 预期结果:

```在页面中显示地址列表```

## 实际结果:

```没有在页面中显示地址列表```

## bug描述:

```uni.chooseLocation()```

| 信息类别       | 信息内容   |
|----------------|------------|
| 产品分类       | uniapp/H5  |
| PC开发环境     | Windows    |
| 操作系统版本   | win7       |
| HBuilderX类型  | 正式       |
| HBuilderX版本  | 3.1.7      |
| 浏览器平台     | Chrome     |
| 浏览器版本     | 89.0.4389.82 |
| 项目创建方式   | HBuilderX  |

更多关于uni-app 不显示位置列表的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 不显示位置列表的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个在H5环境下使用uni.chooseLocation()时常见的样式冲突问题。从描述看,服务端已返回地址列表且DOM元素存在,但被页面样式覆盖导致无法显示。

主要原因是uni-app在H5端调用uni.chooseLocation()会生成一个浮层组件,该组件可能被项目中的全局样式影响。特别是以下样式属性容易造成遮挡:

  • z-index值过低
  • display: nonevisibility: hidden
  • opacity: 0
  • overflow: hidden导致的裁剪

建议检查项目中是否定义了以下全局样式:

/* 可能影响显示的样式 */
.uni-choose-location,
.location-list,
[class*="location"] {
    z-index: 9999 !important;
    display: block !important;
}
回到顶部