uniapp开发微信小程序实现导航功能

最新推荐文章于 2025-04-17 08:34:53 发布

将来养只猫

最新推荐文章于 2025-04-17 08:34:53 发布

阅读量905

点赞数 11

分类专栏： uniapp 文章标签： uni-app 微信小程序小程序

本文链接：https://blog.youkuaiyun.com/weixin_63739785/article/details/145284978

版权

在 Uni-app 中开发微信小程序并实现调取导航功能，可以使用 uni.openLocation 结合用户的导航应用进行导航，或者通过 uni.navigateTo 调用微信的导航功能。以下是一个示例代码，展示如何在按钮点击时调取导航。

<template>
  <view class="container">
    <button @click="navigateToLocation">开始导航</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      latitude: 23.099994,   // 目标地点的纬度
      longitude: 113.324520,  // 目标地点的经度
      name: '目标地点',       // 地点名称（可选）
      address: '目标地址'      // 地址信息（可选）
    };
  },
  methods: {
    navigateToLocation() {
      uni.openLocation({
        latitude: this.latitude,
        longitude: this.longitude,
        name: this.name,
        address: this.address,
        success() {
          console.log('导航成功');
        },
        fail(err) {
          console.error('导航失败', err);
          un