H5跳转到小程序wx-open-launch-weapp

╰半夏微凉° 2022-11-17 05:01 430阅读 0赞

1、引用JS

\}  
2、微信配置  
wx.config(\{  
debug: true,  
appId: ‘’,  
timestamp:, // 必填，生成签名的时间戳  
nonceStr: ‘’, // 必填，生成签名的随机串  
signature: ,// 必填，签名  
jsApiList: \[‘onMenuShareTimeline’\], // 必填，需要使用的JS接口列表  
openTagList: \[‘wx-open-launch-weapp’\] // 可选，需要使用的开放标签列表，例如\[‘wx-open-launch-app’\]  
\});  
3、html代码  
html页面

<wx-open-launch-weapp id="launch-btn"
           username="gh_***"
           path="">   // path为空，跳转到小程序首页，不为空，则指定小程序页面
                        <template>
                            <style>
                                .btn { 
                                    padding: 12px;
                                }
                            </style>
                            <button class="btn">打开小程序</button>
                        </template>
                    </wx-open-launch-weapp>

vue页面或引用vue.js的页面

<wx-open-launch-weapp username="gh_***"
                                      path=""
                                      style="display: inline-block;width: 44vw;height: 17vw;">
                    <script type="text/wxtag-template">
                        <style>
                            .btn { 
                                width: 100%;
                            }
                        </style>
                        <button class="btn">打开小程序</button> 
                    </script>
                </wx-open-launch-weapp>

1.  操作  
    var btn = document.getElementById(‘launch-btn’);  
    btn.addEventListener(‘launch’, function (e) \{  
    console.log(‘success’);  
    \});  
    btn.addEventListener(‘error’, function (e) \{  
    console.log(‘fail’, e.detail);  
    \});