文章目录
示例代码注意事项
官方文档：微信网页开发-开放标签说明文档
示例代码
#launch-btn {
width: 50%
;
background: transparent
;
}
<wx-open-launch-weapp id="launch-btn"
username="gh_xxxxxxxxxxxx"
path="pages/home/home.html">
<template>
<style>.btn{
display: inline-block;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
box-sizing: border-box;
height: 44px;
line-height: 44px;
font-size: 16px;
width: 100%;
background: #d84e43;
border-color: #d84e43;
border-radius: 4px;
}</style>
<button class="btn">打开小程序
</button>
</template>
</wx-open-launch-weapp>
function weixinJsConfig(cfg
) {
wx
.config({
debug
: true,
appId
: cfg
.appId
,
timestamp
: cfg
.timestamp
,
nonceStr
: cfg
.nonceStr
,
signature
: cfg
.signature
,
jsApiList
: [],
openTagList
: ['wx-open-launch-weapp']
});
wx
.checkJsApi({
jsApiList
: [],
success
: function (res
) {
}
});
wx
.error(function (res
) {
});
};
weixinJsConfig();
var btn
= document
.getElementById('launch-btn');
btn
.addEventListener('launch', function (e
) {
console
.log('success');
});
btn
.addEventListener('error', function (e
) {
console
.log('fail', e
.detail
);
});
注意事项
<wx-open-launch-weapp>作为普通标签使用，建议设置一个宽度。
username属性指定需要跳转小程序的原始Id（一般是以gh_打头），而不是appId。
path属性指定跳转到小程序内部哪个页面，需要加.html后缀。
引入weixin.js
<script src
="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script
>
wx.config()的时候指定openTagList
wx
.config({
...
openTagList
: ['wx-open-launch-weapp']
});
