微信小程序内嵌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});
      }
    });
  }

});
相关推荐
律宏阔1 天前
Taro 4 项目从 npm 迁移到 pnpm 踩坑实录
前端·微信小程序·taro
码间留白1 天前
uni-app 鸿蒙离线打包:一个改动从源码到真机要穿过几条链
uni-app·鸿蒙·deveco·离线打包·uts插件
恩创软件开发1 天前
自助KTV系统管理员续单功能
经验分享·小程序
多客:duokelijie2 天前
代练订单系统选型思路:跨品类游戏接入、订单分层管理、自动结算逻辑拆解!
数据库·mysql·微信小程序·前端框架·uni-app·php·持续部署
码间留白2 天前
鸿蒙端对接 BLE 血压计:从一次握手到读数入库(二)设备篇
物联网·uni-app·鸿蒙·蓝牙ble·血压计
AI源码3 天前
在线考试小程序
小程序·notepad++
计算机毕设定制辅导-无忧学长3 天前
《基于微信小程序健康习惯激励系统设计与实现》
java·spring boot·mysql·微信小程序·uniapp·健康习惯激励系统
华玥作者3 天前
Vue 3 + TypeScript + uni-app 组件库推荐:hy-app(华玥组件库)
vue.js·typescript·uni-app
FinelyYang3 天前
uniapp使用kkfileview在线预览ppt,excel,word,pdf类型文件
pdf·uni-app·powerpoint
2501_916008893 天前
iPhone 设备信息查看,用 KeyMob 看型号、序列号、电池健康和 UDID
android·ios·小程序·https·uni-app·iphone·webview