小程序是采用vue+taroui技術(shù)棧
1.內(nèi)嵌h5頁面向小程序傳參:
h5頁面 所在文件:h5.vue
//頁面跳轉(zhuǎn)函數(shù)--前提是在h5頁面引入--"weixin-js-sdk",可通過npm下載
handleRightTc() {
//攜帶的參數(shù)為params
wx.miniProgram.navigateTo({ url: "/pages/fireList/index?params=1" });
},
小程序頁面:wx.vue,這里我用的是taro獲取當(dāng)前頁面棧,大家可以用wx
mounted:{
this.routerParams = Taro.getCurrentInstance().router.params;
}
這里的this.routerParams==={params:1}
2.小程序向內(nèi)嵌h5傳參,這里與上面不同,多了一層過渡
小程序頁面:wx.vue,首先向內(nèi)嵌h5的webview所在頁面跳轉(zhuǎn)并攜帶所傳參數(shù)。
//跳轉(zhuǎn)函數(shù)
//-----/pages/processLink/index此頁面為webview頁面
openCheck(item) {
wx.navigateTo({ url: `/pages/processLink/index?idStr=${item.idStr}`});
},
webview頁面—/pages/processLink/index。index.vue,由該頁面接受小程序傳的參數(shù),并將url拼接完整跳到h5頁面(/pages/processPage/index)
<template>
<view class="index">
<web-view :src="url"></web-view>
</view>
</template>
<script>
import './index.less'
export default {
components: {
},
data () {
return {
url:''
}
},
onLoad(data) {
//data為為攜帶過來的參數(shù)對象
this.url = '地址/pages/processPage/index?idStr='+data.idStr
},
}
</script>
h5頁面(/pages/processPage/index)
mounted() {
this.routerParams = Taro.getCurrentInstance().router.params;
console.log('this.routerParams',this.routerParams)
},
這里的this.routerParams==={idStr:‘’}文章來源:http://www.zghlxwxcb.cn/news/detail-610418.html
總結(jié):
1、h5跳小程序可直接在url后拼接參數(shù)進行跳轉(zhuǎn)。
2、小程序跳內(nèi)嵌h5首先跳到h5所在的webview,再由webview跳轉(zhuǎn)到小程序。
如有不好,請大家指正。文章來源地址http://www.zghlxwxcb.cn/news/detail-610418.html
到了這里,關(guān)于微信小程序與內(nèi)嵌h5頁面之間的參數(shù)傳遞的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!