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

1.问题

微信小程序内嵌h5页面(uniapp写的),使用uni.openLocation打开地图页面后,点击该页面下方"到这里"按钮,显示无法打开。如下图:

3.解决方案

在内嵌h5中不使用uniapp的api打开地图,而在h5页面事件处理程序中去跳转新的小程序页面,在该新页面去使用微信小程序原生的api打开地图。具体代码如下:

(注意:从h5跳转该新的小程序页面,再点击该页面左上方返回按钮时,是会刷新该页面一次的。)

javascript 复制代码
// 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});
      }
    });
  }

});
相关推荐
abigale032 小时前
前端充电 - 移动端 - 小程序登录、跳转/嵌入H5页面
前端·小程序
明耀10 小时前
uniapp或者vue 使用serialport
前端·vue.js·uni-app
xiyueta10 小时前
基于 uni-app 和 Vue3 开发的汉字书写练习应用
uni-app·canvas
黛色正浓10 小时前
【uniapp】新闻列表+跳转详情页+评论展示(uni.request请求接口)
前端·javascript·uni-app
sailven10 小时前
【uniapp】图片添加canvas水印
uni-app·vue·canvas·拍照·图片水印
JefferyAnd10 小时前
uniapp 微信小程序 升级 uniad插件版本号
微信小程序·小程序·uni-app
HerayChen10 小时前
uniapp微信小程序vue3自定义tabbar
微信小程序·小程序·uni-app
wangDer_me10 小时前
uniapp使用蓝牙,usb,局域网,打印机打印
uni-app
小钟H呀10 小时前
Uniapp实现地图获取定位功能
uni-app
说私域15 小时前
百货店的诞生与现代商业革命:结合开源AI智能客服、AI智能名片与S2B2C商城小程序的新视角
人工智能·小程序·开源