41 lines
1.1 KiB
Vue
41 lines
1.1 KiB
Vue
<template>
|
||
<view>
|
||
<!-- 导航容器 -->
|
||
<web-view v-if="showWebView" :src="naviUrl"></web-view>
|
||
|
||
<!-- 触发按钮 -->
|
||
<button @click="startNavigation">开始导航</button>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
showWebView: false,
|
||
naviUrl: ''
|
||
}
|
||
},
|
||
methods: {
|
||
async startNavigation() {
|
||
// 1. 获取当前位置
|
||
const position = await this.getCurrentPosition();
|
||
|
||
// 2. 构建导航URL（高德地图Web版）
|
||
this.naviUrl = `https://uri.amap.com/navigation?from=120.298501,30.41875&to=116.473168,39.993015&mode=car&src=wanmeiyizhan`;
|
||
|
||
// 3. 显示WebView
|
||
this.showWebView = true;
|
||
},
|
||
getCurrentPosition() {
|
||
return new Promise((resolve, reject) => {
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: (res) => resolve(res),
|
||
fail: (err) => reject(err)
|
||
});
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script> |