1、跳转小程序的标签
username：将要跳转的小程序原始appid
path：跳转小程序的页面，可以在后面带参数，参数可以在小程序的onLoad生命周期内获取
env-version：跳转小程序的环境，develop：开发板，trial：体验版，release：正式版
<wx-open-launch-weapp id="launch-btn" username="xxxx" path="xxxx" env-version="trial">
<div v-is="'script'" type="text/wxtag-template">
<div v-is="'style'">
.wx-css{
font-size:13px;
width:60px;
margin-top:4px
}
</div>
<div class="wx-css">
<span class="wx-css">跳转到小程序</span>
</div>
</div>
</wx-open-launch-weapp>
注意：该标签内部不支持svg以及相对路径的图片。
2、配置wx
只有在配置了wx后，才会渲染 wx-open-launch-weapp 标签。
// 引入sdk
import wx from "weixin-js-sdk";
import axios from "axios";
// 请求后端地址，获取签名认证数据
axios({
url: "xxxxx",
method: "GET",
params: {
url: location.href.split('#')[0],
},
}).then((res: any) => {
console.log("获取微信配置", res);
if (res.data.resultCode === "0") {
// 配置微信
wx.config({
// debug: true, // 开启调试模式,
appId: res.data.resultData.appId,
timestamp: res.data.resultData.timestamp,
nonceStr: res.data.resultData.nonceStr,
signature: res.data.resultData.signature,
jsApiList: ["chooseImage"], // 必填，随意一个接口即可
openTagList: ["wx-open-launch-weapp"], // 这里要配置一下
});
wx.ready((e: any) => {
console.log("success", e);
});
wx.error((err: any) => {
console.log("fail", err);
});
}
// 只有验证成功后才触发
document.addEventListener("WeixinOpenTagsError", (e: any) => {
console.error("WeixinOpenTagsError", e.detail.errMsg); // 无法使用开放标签的错误原因，需回退兼容。仅无法使用开放标签，JS-SDK其他功能不受影响
});
});
注意：url地址是需要在公众号去配置的，不然签名不会通过，那么标签也是无法正常渲染。
3、忽略标签
在使用中，会有提示说没有这个标签。我们可以忽略这个提示。
const app = createApp({})
app.config.compilerOptions.isCustomElement = tag => tag.startsWith('wx-open-launch-weapp')
