Webview
1、封装组件
<template>
<view>
<web-view :src="src"></web-view>
</view>
</template>
<script>
export default {
props: {
src: {
type:String,
default(){
return ""
}
}
},
methods: {
}
}
</script>
<style>
</style>
2、引用组件-返回上一页
<template>
<view class="page">
<view class="">
<!-- #ifndef MP-WEIXIN -->
<yk-web :src="src"></yk-web>
<view class="chat_fixed"></view>
<!-- #endif -->
</view>
</view>
</template>
<script>
import ykWeb from '../components/web_view.vue'
var _self;
var wv; //计划创建的webview
export default {
components:{
ykWeb
},
data() {
return {
userinfo: {
},
src: 'XXXXXXX',
type:'',
id:''
}
},
onBackPress(option) {
console.log(option.from)
if(option.from=="backbutton"){
this.custom()
return true
}
},
onLoad(option) {
_self = this
if(option.type){
_self.type = option.type
}
},
onReady() {
// #ifdef APP-PLUS
var currentWebview = this.$scope.$getAppWebview()
//此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效，非v3编译模式使用this.$mp.page.$getAppWebview()
setTimeout(function() {
wv = currentWebview.children()[0]
wv.setStyle({
bottom:0})
}, 1000); //如果是页面初始化调用时，需要延时一下
// #endif
},
methods: {
custom(){
if(this.type=='chat'){
uni.switchTab({
url:'xxxxx'//上一页为tab
})
}
if(this.type=="task"){
uni.redirectTo({
url:'xxxxx'+ _self.id//上一页为二级页面
})
}
}
}
}
</script>
3、返回二级页面，未关闭上一级页面，会增加一层页面
解决方法如下：
//二级页面
<u-navbar :custom-back="customChange" back-icon-color="#fff" title-color="#fff" ></u-navbar>//u-view 自定义导航
onBackPress(option) {
//监听返回
if(option.from=="backbutton"){
this.customChange()
return true
}
},
methods: {
customChange(){
//返回
uni.navigateBack({
delta:2
})
},
}