1,先把这个链接给后端 让后端写个接口
需要把path路径(跳到小程序的那个页面的路径)给后端
2,上代码(vue2框架)
<template>
<button type="button" class="btnGoWeapp" @click="goWeapp">点击跳转小程序</button>
</template>
<script>
import $ from '../utils/axios'
export default {
mounted(){
},
methods: {
goWeapp(){
// 先判断是不是pc端打开的h5 如果是pc端提醒用手机打开页面
if(window.navigator.userAgent.indexOf("Windows") != -1){
window.alert("请使用手机打开!")
}else{
// 调取接口获取URL Scheme
$.post('/api/wx/GenerateScheme', {
path:"pages/store/index",//打开的小程序页面路径
query:""//传递的参数 在小程序 onload(options) options中可以拿到
})
.then(res => {
let UrlScheme=res.Data
// 打开小程序
window.open(UrlScheme);
})
}
}
}
}
</script>
<style scoped>
.btnGoWeapp{
width: 50%;
font-size: 0.2rem;
}
</style>
注意:苹果手机可能跳不成功
延迟一点拿到路径再跳
let UrlScheme=res.Data
// 打开小程序
// window.open(UrlScheme);
setTimeout(()=>{
window.open(UrlScheme);
},200)
完事~