微信内h5页面打开小程序

微信内h5页面打开小程序

2021-08-02 497
下载不了?请联系网站客服提交链接错误!
增值服务:
微信内h5页面打开小程序
最近更新 2021年08月02日
资源编号 86786

微信内h5页面打开小程序

2021-08-02 小程序教程 0 497 百度已收录
限时活动VIP只需20元
增值服务:
¥ 0 钻石 开通VIP尊享优惠特权
立即下载 升级会员
详情介绍

相关配置

  1. 微信js文件版本大于等于1.6.0
    https://res.wx.qq.com/open/js/jweixin-1.6.0.js
  2. 微信授权配置

    window.wx.config({
     ...otherConfig,
     openTagList: [\'wx-open-launch-weapp\']
    })
  3. 调用示例

    const style = {
      position: \'absolute\',
      top: 0,
      right: 0,
      bottom: 0,
      left: 0,
    };
    
    function OpenWeapp({ originId, pagePath }) {
      return (
     <wx-open-launch-weapp username={originId} path={pagePath} style={style}>
       <script type=\"text/wxtag-template\">
         <div style={style} />
       </script>
     </wx-open-launch-weapp>
      );
    }
    
    // 使用方式
    <div style={{ position: \'relative\' }}>
    点击跳转小程序
    <OpenWeapp originId=\"gh_xxxxxxxx\" pagePath=\"pages/home/index?user=123&action=abc\" />
    </div>
    

为什么给div添加position: relative呢?

由于wx-open-launch-weapp设置样式比较困难,故放弃设置样式,将wx-open-launch-weapp作为一个透明的占位元素,撑满父元素,也能达到预期的功能。

资源下载此资源仅限注册用户下载,请先

1、本站赞助VIP,仅需【128】元即可 ! ! ! (赞助后永久享受整站资源全部免费下载)
2、站内资源均可通过签到等任务进行免费兑换。(鼓励大家签到)
3、站内资源均来源于网络公开发表文件或网友投稿发布,如侵犯您的权益,请联系管理员处理。
4、本站所分享的源码、模板、软件工具等其他资源,都不包含技术服务,请大家谅解!
5、所有资源均收集于互联网仅供学习、参考和研究,请理解这个概念,所以不能保证每个细节都符合你的需求,也可能存在未知的BUG与瑕疵,因本站资源均为可复制品,所以不支持任何理由的退款兑现(特殊情况可退积分),请熟知后再赞助下载!收取的费用只为能长期与大家分享学习,本站为非商业性网站,纯属个人爱好!

K4资源 小程序教程 微信内h5页面打开小程序 https://www.k4sc.com/86786.html

相关文章

评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务