美文网首页
小程序总结(十五)- 关于web-view嵌套的H5页面的分享功

小程序总结(十五)- 关于web-view嵌套的H5页面的分享功

作者: 自律财富自由 | 来源:发表于2018-12-18 17:26 被阅读0次

    看过了很多别人的博客,吸收 了他们的主要思想,但是觉得他们又写的太复杂,于是决定自己写一篇,一目了然,简单直接。

    需求:

    1、使用小程序打开m站的h5页面
    2、打开之后,用户可以进行分享H5页面的内容

    1、内嵌H5页

    <!-- url是已在微信公众平台配置的h5链接 -->
    // web-view的WXML
    <web-view src='{{url}}'></web-view>
    

    2、分享H5

    // js部分
    1、在点击跳转web-view的时候,将该页面的路径存在storage上
    // 存储分享路径, url是H5页面的链接
    wx.setStorageSync('sharePagePath', '/pages/**/H5/H5?url=' + url)
    
    2、在web-view的js文件中调用分享函数
    onShareAppMessage: function (options) {
        return {
          title: wx.getStorageSync('sharePageTitle'),
          // 这里是关键一
          path: wx.getStorageSync('sharePagePath'),
          success: (res) => {
            this.setData({
          // 这里是关键二
              url: options.webViewUrl
            })
          }
        }
      }
    

    相关文章

      网友评论

          本文标题:小程序总结(十五)- 关于web-view嵌套的H5页面的分享功

          本文链接:https://www.haomeiwen.com/subject/onblkqtx.html