(1) 使用web-view组件内嵌网页
<web-view src="https://www.jianshu.com/u/4da122c54fa1" @message="getMessage"></web-view>
有titile.jpg
实战示例:index.vue
<template>
<view>
<web-view :src="url" @message="getMessage"></web-view>
</view>
</template>
<script>
var wv;//计划创建的webview
export default {
data() {
return {
// url: 'https://www.jianshu.com/u/4da122c54fa1'
// url: 'http://mes.uchat.com.cn/board/line?deptid=118'
url: ''
}
},
onLoad(options) {
if (options && options.deptid) {
console.log("onLoad:" + options.bid + "," + options.deptid);
switch (options.bid){
case "1":
this.url = 'http://mes.uchat.com.cn/board/board2?deptId=' + options.deptid;
break;
case "2":
this.url = 'http://mes.uchat.com.cn/board/machineBoard?deptId=' + options.deptid;
break;
case "3":
this.url = 'http://mes.uchat.com.cn/b/' + options.deptid;
break;
case "4":
this.url = 'http://mes.uchat.com.cn/board/line?deptid=' + options.deptid;
break;
default:
this.url = 'http://mes.uchat.com.cn/board/line?deptid=118';
break;
}
}
},
onReady() {
// #ifdef APP-PLUS
// var currentWebview = this.$mp.page.$getAppWebview() //获取当前页面的webview对象
// setTimeout(function() {
// wv = currentWebview.children()[0]
// wv.setStyle({top:150,height:300})//重设web-view组件的样式,比如调整大小
// wv.setStyle({scalable:true})//设置web-view组件可双指缩放
// }, 1000); //如果是页面初始化调用时,需要延时一下
// #endif
},
methods: {
getMessage(event) {
uni.showModal({
content: JSON.stringify(event.detail),
showCancel: false
});
}
}
}
</script>
<style>
</style>
(2) 去除网页title—页面不启用系统导航即可
"app-plus": {
"titleNView": false //不启用系统导航
}
无title.jpg
示例:pages.json
{
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
{
"path" : "pages/home/home",
"style" : {
"navigationBarTitleText": "uni-app"
}
},
{
"path": "pages/index/index",
"style": {
// "navigationBarTitleText": "uni-app"
"app-plus": {
"titleNView": false //不启用系统导航
}
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
}
}
备注
:常见问题请移步:web-view加载网络html页面的实现及问题
网友评论