当前位置：首页 > article >正文

微信小程序内嵌h5页面（uniapp写的），使用uni.openLocation无法打开页面问题

article 2024/11/19 22:42:43

1.问题

微信小程序内嵌h5页面（uniapp写的），使用uni.openLocation打开地图页面后，点击该页面下方“到这里”按钮，显示无法打开。如下图：
在这里插入图片描述

3.解决方案

在内嵌h5中不使用uniapp的api打开地图，而在h5页面事件处理程序中去跳转新的小程序页面，在该新页面去使用微信小程序原生的api打开地图。具体代码如下：
（注意：从h5跳转该新的小程序页面，再点击该页面左上方返回按钮时，是会刷新该页面一次的。）

// pages/location/location.js

Page({
  data: {
    needBack: false
  },
  
  onLoad: function (options) {
    const {longitude, latitude, name} = options;
    this.openLocation(longitude, latitude, name);
  },
  
  onShow: function() {
    // 从导航页退回的时候，就再次跳转回到之前webview的小程序页面，其实也就是该页面
    if (this.data.needBack) {
      wx.navigateBack();
    }
  },
  
  openLocation: function (longitude, latitude, name) {
    wx.openLocation({
      latitude: Number(latitude),
      longitude: Number(longitude),
      scale: 18,
      name,
      complete: () => {
        this.setData({needBack: true});
      }
    });
  }

});