微信小程序webview内嵌uniapp H5,H5可以跳转到小程序内的某个指定页面

 使用uniapp开发小程序,又使用uniapp开发h5,这时候内部跳转uni.navigateTo可能分不清哪个是哪个,官方给出了解决:

 1、小程序中使用webview内嵌H5

<template>
  <view style="width: 100%; height: 100%;">
    <web-view v-if="url" :src="url"></web-view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        url: '',
      }
    },
    onLoad: function(option) {
      this.url='https://syzhtc.syjtgroup.com/hitest/test/reserve?uid=aaa12345&phone=15588687004&startLocation=1'
    },
  }
</script>

<style lang="scss" scoped>
</style>

1、使用uniapp开发H5,入口文件reserve.html设置如下:

 2、H5的页面如下:

3、从H5跳转到小程序,跳转到小程序内的某个指定页面,如:/pages/interfacemap/interfacemap页面

    <button class="btn-long test">试验试验试验</button>
    <button class="btn-long test" @click="ditu()">地图map-uni.webView-加函数 </button>
    <button class="btn-long test" @click="pay()">支付pay2-jWeixin.miniProgram </button>

 uni.webView.navigateTo或jWeixin.miniProgram.navigateTo实现从H5跳转到小程序,如下所示:

methods: {
      ditu(){
        console.log("uni.webView",uni.webView)
        uni.webView.navigateTo({
          url: '/pages/interfacemap/interfacemap?test=map',
          success: res => {
            console.log("success")
          },
          fail: () => {
             console.log("fail")
          },
          complete: () => {
             console.log("complete")
          }
        });
      },
      pay(){
        console.log("jWeixin.miniProgram",jWeixin.miniProgram)
        jWeixin.miniProgram.navigateTo({
          url: '/pages/interfacemap/interfacemap?test=pay'
        });
      },
  • 1
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

佛佛ง

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值