# uni.openLocation(options)
注意
HBuilderX 5.11起，openLocation已内置在uni-app x框架内，无需再单独导入uni-openlocation插件；HBuilderX 5.11之前，如需使用，请前往插件市场导入该插件：插件地址无论是内置能力还是导入
uni-openlocation插件，通过uni.openLocation打开的页面都会以dialogPage的形式呈现。此时执行getDialogPages方法时，由openLocation打开的页面也会包含在返回的页面数组中，这属于正常现象。HarmonyOS平台调用此 API 需要申请定位权限ohos.permission.APPROXIMATELY_LOCATION、ohos.permission.LOCATION，需自行在项目中配置权限。
使用应用内置地图查看位置
# openLocation 兼容性
| Web | 微信小程序 | Android | iOS | HarmonyOS |
|---|---|---|---|---|
| 4.0 | 5.11 | 5.11 | 5.11 | 5.11 |
# 参数
| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 | ||||||||||||||||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| options | OpenLocationOptions | 是 | - | - | uni.openLocation函数参数定义 | ||||||||||||||||||||||||||||||||||||||||||||||||||||||
| |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
# OpenLocationSuccess 的属性值
| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |
|---|---|---|---|---|---|
| errMsg | string | 是 | - | - | - |
# OpenLocationFail 的属性值
| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |
|---|---|---|---|---|---|
| errCode | number | 是 | - | - | 错误码 |
| errSubject | string | 是 | - | - | 统一错误主题（模块）名称 |
| data | any | 否 | - | - | 错误信息中包含的数据 |
| cause | Error | 否 | - | - | 源错误信息，可以包含多个错误，详见SourceError |
| errMsg | string | 是 | - | - | - |
# 示例
示例为hello uni-app x alpha分支，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例另见
示例
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-left">
<view class="uni-label">经度</view>
</view>
<view class="uni-list-cell-db">
<text class="readonly-text">{{ longitude }}</text>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-list-cell-left">
<view class="uni-label">纬度</view>
</view>
<view class="uni-list-cell-db">
<text class="readonly-text">{{ latitude }}</text>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-list-cell-left">
<view class="uni-label">位置名称</view>
</view>
<view class="uni-list-cell-db">
<text class="readonly-text">{{ name }}</text>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-list-cell-left">
<view class="uni-label">详细位置</view>
</view>
<view class="uni-list-cell-db">
<text class="readonly-text">{{ address }}</text>
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="tips">注意：需要正确配置地图服务商的Key才能正常显示位置</view>
<view class="uni-btn-v uni-common-mt">
<button type="primary" @click="openLocation">查看位置</button>
</view>
</view>
</view>
</view>
</template>
<script lang="uts" setup>
import { state, setLifeCycleNum } from '@/store/index.uts';
type DataType = {
dialogPagesNum: number;
};
// 响应式数据
const title = ref('openLocation');
const longitude = ref(116.39747);
const latitude = ref(39.9085);
const name = ref('天安门');
const address = ref('北京市东城区东长安街');
// 自动化测试
const data = reactive({
dialogPagesNum: -1,
} as DataType);
// 生命周期钩子
onPageShow(() => {
console.log('Page Show');
// 自动化测试
setLifeCycleNum(state.lifeCycleNum + 1);
});
onPageHide(() => {
console.log('Page Hide');
// 自动化测试
setLifeCycleNum(state.lifeCycleNum - 1);
});
// 自动化测试
const test = () => {
const pages = getCurrentPages();
const page = pages[pages.length - 1];
// #ifdef APP || WEB
const dialogPages = page.getDialogPages();
data.dialogPagesNum = dialogPages.length;
// #endif
};
// 方法
const openLocation = () => {
uni.openLocation({
longitude: longitude.value,
latitude: latitude.value,
name: name.value,
address: address.value,
});
// 自动化测试
setTimeout(() => {
test();
}, 500);
};
// 自动化测试
const pageSetLifeCycleNum = (value: number) => {
setLifeCycleNum(value);
};
// 自动化测试
const getLifeCycleNum = (): number => {
return state.lifeCycleNum;
};
defineExpose({
data,
openLocation,
pageSetLifeCycleNum,
getLifeCycleNum,
});
</script>
<style>
.readonly-text {
color: #999999;
font-size: 14px;
line-height: 22px;
padding-top: 10px;
padding-bottom: 10px;
}
.uni-list-cell-left {
padding: 0 15px;
}
.tips {
font-size: 12px;
margin-top: 15px;
opacity: 0.8;
}
</style>
