uni-app打包app时chooseLocation在有位置信息情况下地址列表第一条被截断

产品分类：

uniapp/App

PC开发环境操作系统：

Windows

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

win10

HBuilderX类型：

正式

HBuilderX版本号：

4.24

手机系统：

Android

手机系统版本号：

Android 11

手机厂商：

vivo

手机机型：

iqoo一代，vivo x100

页面类型：

vue

vue版本：

打包方式：

云端

项目创建方式：

HBuilderX

示例代码：

uni.chooseLocation({
latitude: that.lat || that.$api.CFG.lat || '',
longitude: that.lng || that.$api.CFG.lng || '',
success(res) {
// console.log(res)
that.addr = res.name ? res.name + '-' + res.address : res.address;
that.lng = res.longitude;
that.lat = res.latitude;
},
fail(err) {  
}  
})

操作步骤：

必现，按上述方法

预期结果：

app正常显示，不要截断

实际结果：

如上述描述那样

bug描述：

app端使用chooseLocation 把已存在的地址经纬度信息传过去有时候列表第一条数据底下会少半截

caililin 1楼•2 天前

在使用uni-app进行应用打包时，遇到chooseLocation接口在有位置信息情况下地址列表第一条被截断的问题，这通常与界面布局或数据渲染方式有关。下面提供一个代码案例，展示如何在uni-app中正确使用chooseLocation接口，并确保地址列表能正确显示，避免第一条地址被截断。

首先，确保你的uni-app项目已经正确配置了相关的权限和依赖。chooseLocation接口依赖于系统的位置服务，因此需要在manifest.json中声明位置权限。

1. 配置权限

在manifest.json中，添加必要的权限配置：

"mp-weixin": { // 示例，针对微信小程序，其他平台类似
    "requiredPrivateInfos": ["getLocation"]
}

2. 使用chooseLocation接口

在页面的JS文件中，调用chooseLocation接口，并处理返回的地址列表。

// pages/index/index.vue
<template>
  <view>
    <button @click="chooseLocation">选择位置</button>
    <view v-for="(address, index) in addresses" :key="index">
      {{ address.name }} - {{ address.address }}
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      addresses: []
    };
  },
  methods: {
    chooseLocation() {
      uni.chooseLocation({
        success: (res) => {
          // 假设返回的结果中包含addressList字段
          this.addresses = res.addressList || [];
        },
        fail: (err) => {
          console.error('chooseLocation failed:', err);
        }
      });
    }
  }
};
</script>

<style scoped>
/* 确保有足够的空间显示地址列表 */
view {
  margin: 10px;
}
button {
  margin-bottom: 20px;
}
</style>

3. 样式调整

确保页面布局有足够的空间来显示地址列表，避免因为空间不足而导致内容被截断。在上面的样式中，已经通过简单的margin设置来确保按钮和地址列表之间有足够的间距。

4. 测试与调试

在不同的设备和屏幕尺寸上测试应用，确保地址列表能够正确显示。
如果问题依旧存在，检查是否有其他CSS样式或布局问题影响了地址列表的显示。
使用开发者工具的控制台输出地址列表数据，确保数据完整无误。

通过上述步骤，你应该能够解决chooseLocation返回的地址列表第一条被截断的问题。如果问题依旧，可能需要进一步检查页面的布局和渲染逻辑。