140 行
3.4 KiB
Plaintext
140 行
3.4 KiB
Plaintext
<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>
|