• 小程序 web-view 嵌套的网页跳转到小程序内部页面 实现无缝连接


    需要在H5页面被作出判断和处理  点击事件发生时跳转到小程序内部页面

    1.引入小程序提供的JS

    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

    2.通常情况下一个H5页面可能应用到多个活动场景中 并不止在小程序中使用

       这时候就需要在小程序里面加入一个参数作为判断 (以下代码中参数名为channel=‘wechat’)

    小程序中:

    onLoad: function (options) {
        var url = '';               //此处的url是你的H5页面的网址
        if(url.indexOf('?')>0){     //在这儿添加参数 以便于进入H5页面时好做判断
          this.url = url + '&channel=wechat'
        }else{
          this.url = url + '?channel=wechat'
        }
        this.setData({
          url: this.url
        })
      },
    <web-view src="{{ url }}"></web-view>

    H5页面中

    function GetQueryString(name) {                    //截取链接中的参数
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    }
    var channel = GetQueryString("channel");
    $(document).on('click', '.go', function() {if (channel && channel == 'wechat') {
        wx.miniProgram.navigateTo({
          url: '',    //此处的url是你小程序里面页面的路由
        });
      } 
    });

    3.如果该H5页面只用在小程序里面 则不需要做判断了 直接跳转

    H5页面中:

    $(document).on('click', '.go', function() {
        wx.miniProgram.navigateTo({
          url: '',    //此处的url是你小程序里面页面的路由
        });
    });
  • 相关阅读:
    WPF GridControl单元格值与过滤值相同时,改变单元格背景色
    WPF 新手引导
    WPF 使用QRCoder生成二维码
    WPF MaterialDesignInXamlToolkit锁屏恢复后页面冻结的问题
    MVVM Caliburn.Micro学习记录
    手机分辨率DPI怎么计算
    SQLite数据类型
    Android给Viewpager默认指定页
    Android 禁止Viewpager左右滑动功能
    JAVA中获取当前系统时间
  • 原文地址:https://www.cnblogs.com/luffyc/p/10573321.html
Copyright © 2020-2023  润新知