vue使用wx-open-launch-weapp
作者:互联网
此功能的开放对象:
- 已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。(二级域名也需要配)
- 已认证的非个人主体的小程序,使用小程序云开发的静态网站托管绑定的域名下的网页,可以使用此标签跳转任意合法合规的小程序。
如果你的代码遇到页面不出现按钮的问题
- 查看 openTagList 是否为 [‘wx-open-launch-weapp’] ,官网默认给的wx-open-launch-app
- 官网例子中template标签要替换为
<script type="text/wxtag-template"><script>
- path可以不传,但是传一定要加html后缀
下面是实测可用代码,替换接口就ok。 username替换成你的小程序原始ID
<template>
<div style="width: 100%; height: 100%;">
按钮按钮:
<wx-open-launch-weapp
username="gh_"
path="/pages/index/index.html"
>
<script type="text/wxtag-template">
<style>.btn { padding: 12px}</style>
<button class="btn">跳转小程序</button>
</script>
</wx-open-launch-weapp>
</div>
</template>
<script>
import {openWxmini} from '@/assets/js/api.js'
export default {
methods: {
wxmini(){
// 获取密钥
openWxmini({url:window.location.href}).then(res=>{
let {appId,nonceStr,signature,timestamp} = res.result
wx.config({ // eslint-disable-line
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印
appId, // 必填,公众号的唯一标识
timestamp, // 必填,生成签名的时间戳
nonceStr, // 必填,生成签名的随机串
signature,// 必填,签名
jsApiList: ['onMenuShareTimeline'], // 必填,需要使用的JS接口列表
openTagList: ['wx-open-launch-weapp'] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']
});
/* eslint-disable */
wx.ready(function () {
console.log('ready')
});
})
}
},
created() {
const oScript = document.createElement('script');
oScript.type = 'text/javascript';
oScript.src = 'https://res2.wx.qq.com/open/js/jweixin-1.6.0.js';
oScript.onload = this.wxmini
document.body.appendChild(oScript);
},
}
</script>
<style>
</style>
标签:vue,必填,launch,weapp,js,oScript,open,wx 来源: https://blog.csdn.net/CherryCola_zjl/article/details/111165702