小程序唤起地图导航

小程序唤起地图导航

场景描述：小程序中使用webview内嵌h5页面，h5页面中会获取目的地经纬度调起手机自带的导航APP，那么问题来了，h5唤起手机导航打开的是网页版的，似乎小程序自带的方法就挺好用哈
代码：
首先在h5中调用微信小程序的方法，h5跳转到小程序

方法如果调用失败，检查是否引用sdk,package.json文件中是否配置
import wx from ‘weixin-js-sdk’
“weixin-js-sdk”: “^1.4.0-test”,
“weixin-jsapi”: “^1.1.0”

wx.miniProgram.navigateTo({
            url: '/pages/index/containerMap?lng=' + lng + "&lat=" + lat + "&address=" + address,
            success: function() {
              console.log('打开地图成功')
            },
            fail: function() {
              that.showPlugin("打开地图失败了~");
              return;
            },
            complete: function() {
            }
          });

接下来就是小程序对应的页面js里面
pages/index/containerMap.js

Page({
  data: {

  },

  onLoad: function (options) {
    console.log('---------------------------')
    console.log(options)
    let longitude = options.lng;
    let latitude = options.lat;
    let address = options.address;
    longitude = parseFloat(longitude);
    latitude = parseFloat(latitude);
    wx.openLocation({
      latitude: latitude,
      longitude: longitude,
      address: address,
      scale: 15
    })
  },
  
})

OK，完美打开，但是还有一个小坑没有填，导航返回到当前页面要想返回主页，需要点击两次返回键，点一次页面空白，这个后续解决，有答案的大家可以留言帮助一下可怜的孩子~

---------------------------------------------2020-07-30----------------------------------------------------------------------------------------------------
经过大佬的评论，当时匆忙没有仔细研究wx.openLocation方法，在这里再次感谢大佬的指导，结合最近编写小程序，我总结一下处理方法：
1.wx.miniProgram.navigateTo进入小程序页面时，onload函数中设置一个标志，比如 flag默认为false，设置成true,接着打开地图，返回时在该页面onshow方法中进行判断,如果为true，直接返回到首页（利用onload只执行一次，onshow每次打开页面都执行机制，navigate to跳转页面并未销毁当前页面，只是隐藏了）

// pages/index/map.js
Page({
  data: {
    flag:false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      flag:true
    })
    wx.openLocation({
      latitude: 39,
      longitude: 117,
      address: 'test',
      scale: 15
    })
  },
  onShow: function () {
    if(this.data.flag){
      const pages = getCurrentPages();
    if (pages.length >= 2) {
      wx.navigateBack({
        delta: 2
      });
    } else {
      //返回tab页面使用
      wx.switchTab({
        url: '/pages/index/index'
      });
    }
    }
  }
})

不断学习，不断进步~