uniapp開發(fā)的小程序 以及微信小程序都可以的捶枢！
首先說明我這套的h5頁面里面有可視化圖表，h5頁面里面無接口請求飞崖，只是在小程序里面通過地址欄傳參到vue寫的h5頁面里面拿到數(shù)據(jù)進行一個頁面渲染烂叔，h5頁面可截圖（前端實現(xiàn)截屏功能）。 小伙伴可以根據(jù)自己的項目業(yè)務(wù)去擴展哈
注意說一下 onLoad里面接收參數(shù)需要解碼 ９掏帷３ひ选！昼牛！
<template>
<view class="container">
<web-view :src="urls+dataList"></web-view>
</view>
</template>
<script>
export default {
data() {
return {
datas:'',
urls:'',//地址
}
},
onLoad(option){
if(process.env.NODE_ENV == 'development'){//h5分享頁的生產(chǎn)和測試環(huán)境地址區(qū)分
this.urls='https://xxx.cn/xxx/xxx'
}else{//生產(chǎn)
this.urls='https://xxxxx/xxxxxxx/xxxx'
}
if(option.url){ //有參數(shù)就證明是從分享的地方點擊過來的术瓮，就帶著參數(shù)直接打開連接
this.dataList='?'+option.url
}else{ //無參數(shù)就證明用戶是從首頁走過來的走接口拿數(shù)據(jù)
this.H5jump()
}
},
methods: {
onShareAppMessage(options) {
const { webViewUrl } = options;
let search = '',
let data = webViewUrl.split('?')[1]; //截取地址？后面的參數(shù)
const shareObj = {
title: "我已經(jīng)堅持背詞好幾天啦", // 默認是小程序的名稱(可以寫slogan等)
path: '/pages/index/index?url='+data, // 默認是當前頁面贰健，必須是以‘/’開頭的完整路徑胞四，通過拼接的方式，把需要分享的web-view的url以及參數(shù)拼接進去伶椿，然后在該`web-view`的頁面中去做參數(shù)判斷辜伟，一旦傳入了對應(yīng)的url和參數(shù)，就進入對應(yīng)的url并攜帶對應(yīng)的參數(shù)
// imageUrl: '', //自定義圖片路徑脊另，可以是本地文件路徑导狡、代碼包文件路徑或者網(wǎng)絡(luò)圖片路徑，支持PNG及JPG偎痛，不傳入 imageUrl 則使用默認截圖旱捧。顯示圖片長寬比是 5:4
success: function (res) {
// 轉(zhuǎn)發(fā)成功之后的回調(diào)
if (res.errMsg == 'shareAppMessage:ok') {
}
},
fail: function () {
// 轉(zhuǎn)發(fā)失敗之后的回調(diào)
if (res.errMsg == 'shareAppMessage:fail cancel') {
// 用戶取消轉(zhuǎn)發(fā)
} else if (res.errMsg == 'shareAppMessage:fail') {
// 轉(zhuǎn)發(fā)失敗，其中 detail message 為詳細失敗信息
}
},
complete: function () {
// 轉(zhuǎn)發(fā)結(jié)束之后的回調(diào)（轉(zhuǎn)發(fā)成不成功都會執(zhí)行）
}
}
// 來自頁面內(nèi)的按鈕的轉(zhuǎn)發(fā)
if (options.from == 'button') {
var data= options.target.dataset;
// 此處可以修改 shareObj 中的內(nèi)容
// shareObj.path = '/pages/index' + data.name;
}
// 返回shareObj
return shareObj;
},
H5jump(){ //接口拿到數(shù)據(jù)傳給h5頁面渲染頁面
let data = {
id:'1231414324'
}
apiaxios(data).then(res => {
console.log('接口返回參數(shù)',res)
if(res.code == 200) {
this.datas=JSON.stringify(res.data)
this.dataList='?webview='+this.datas+'&userinfo='+store.state.user.nickName
}
}).catch(error=>{
console.log('',error)
})
},
}
}
</script>
