微信开发标签wx-open-launch-weapp在uniapp中的动态创建使用
·
wx-open-launch-weapp标签的介绍就不多说了,可以去看微信官方文档
注意事项已经写到代码中
操作步骤:
html: 一定要是div
<div id="wx"></div>
// 创建微信开放标签
function createWeappLauncher(item) {
const container = document.getElementById('wx');
// 创建微信开放标签
const weappLauncher = document.createElement('wx-open-launch-weapp');
weappLauncher.id = 'launch-btn';
weappLauncher.setAttribute('appid', item.wx_appid);
weappLauncher.setAttribute('path', item.wx_page);
// 创建模板内容
const template = document.createElement('script');
template.type = 'text/wxtag-template';
// 此处一定要写固定单位,不要用百分比这种
template.innerHTML = `<style>
.item {
width: 180px;
height: 100px;
}
</style><div class="item">确认</div>`;
weappLauncher.appendChild(template);
container.innerHTML = '';
container.appendChild(weappLauncher);
// 添加事件监听
setTimeout(() => {
weappLauncher.addEventListener('launch', function (e) {
deduct_points({
userid: uni.getStorageSync('header').id,
goodsid: item.id
})
});
// weappLauncher.addEventListener('error', function (e) {
// });
}, 100);
}
// 签名参数需要后端给处理好
jWeixin.config({
appId: res.data.appid, // 必填,服务号的唯一标识
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
signature: res.data.signature,// 必填,签名
jsApiList: [''], // 必填,需要使用的JS接口列表,不注册随便填
openTagList: ['wx-open-launch-weapp'] // 可选,需要使用的开放标签列表,例如['wx-open-launch-weapp']
})
jWeixin.ready(() => {
// 创建微信开放标签
createWeappLauncher(item)
})
更多推荐
所有评论(0)