微信小程序中的web-view,实现微信小程序与h5页面间跳转
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、pandas是什么?二、使用步骤1.引入库2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、pandas是什么?示例:pandas 是基于N
·
一、从小程序跳转webview

二、从webview(h5)跳转小程序
1.先引入微信JS-SDK
/*方式一*/
const script = document.createElement('script')
script.type = 'text/javascript'
script.src = 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
document.body.appendChild(script)
/*方式二*/
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
由于我使用了eslint,导致报错 ‘wx’ is not defined no-undef,
解决方案:在.eslintrc.js文件中加入以下内容,就不报错了
globals: { wx: true },
2.判断是否在小程序的webview中打开,还是在浏览器中打开,如果webview中打开显示跳转到小程序的按钮
// 跳转小程序按钮是否显示 ,由于我使用wx.miniProgram.getEnv(function(res) { console.log(res.miniprogram) })
//获取当前环境好像有点bug(如果有知道的小伙伴,可以评论区或者私信告诉我哦~感谢),
//就采用了让小程序在跳转的时候加了一个参数intoType = webview,如果有此参数就显示,否则不显示
showWebView() {
var ua = navigator.userAgent.toLowerCase()
if (
ua.match(/MicroMessenger/i) &&
ua.match(/MicroMessenger/i).toString() === 'micromessenger' &&
this.getUrlParam('intoType') &&
this.getUrlParam('intoType') === 'webview'
) {
// ios的ua中无miniProgram,但都有MicroMessenger(表示是微信浏览器)
this.isShowWebView = true
return false
// wx.miniProgram.getEnv(res => {
// if (res.miniprogram) {
// this.isShowWebView = true
// alert('在小程序里')
// return false
// } else {
// this.isShowWebView = false
// alert('不在小程序里')
// return false
// }
// })
} else {
this.isShowWebView = false
return false
}
},
3.this.getUrlParam(‘intoType’) 方法
// h5页面获取小程序传参
getUrlParam(name) {
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
var r = window.location.search.substr(1).match(reg)
if (r != null) return unescape(r[2])
return null
}
4.点击跳转
// webview 跳转小程序
backWebView() {
const script = document.createElement('script')
script.type = 'text/javascript'
script.src = 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
document.body.appendChild(script)
wx.miniProgram.reLaunch({
url: '/pages/agent/goods/list/index',
success: function () {
console.log('success')
},
fail: function () {
console.log('fail')
}
})
},
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐

所有评论(0)