From 8833bac4659efce39bee58e93fe1a95698fe07c1 Mon Sep 17 00:00:00 2001 From: wanganxp Date: Thu, 5 Sep 2019 15:04:57 +0800 Subject: [PATCH] Update web-view.md --- docs/component/web-view.md | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/docs/component/web-view.md b/docs/component/web-view.md index cca496fce..0053edae5 100644 --- a/docs/component/web-view.md +++ b/docs/component/web-view.md @@ -217,6 +217,19 @@ export default { ``` +如果想设置web-view组件可双指缩放,可参考如下代码: +```js +onReady() { + // #ifdef APP-PLUS + var currentWebview = this.$mp.page.$getAppWebview() //获取当前页面的webview对象 + setTimeout(function() { + wv = currentWebview.children()[0] + wv.setStyle({scalable:true}) + }, 1000); //如果是页面初始化调用时,需要延时一下 + // #endif + } + }; +``` ##### `web-view`组件的层级问题解决 web-view组件在App和小程序中层级较高,如需要在vue页面中写代码为web-view组件覆盖内容,小程序端无解,只能由web-view的组件自己弹出div。App端有如下若干方案: @@ -225,6 +238,13 @@ web-view组件在App和小程序中层级较高,如需要在vue页面中写代 3. 也可以使用HBuilderX1.9.10以后新出的[原生子窗体subNvue](/api/window/subNVues) 4. 也可以在web-view组件内嵌的网页中弹出z-index更高的div。如果是外部网页,可以在vue中获得子webview对象后,通过[evalJS](https://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.WebviewObject.evalJS)为这个子webview注入一段js,操作其弹出div层。 +##### web-view组件的浏览器内核说明 +- H5端的web-view其实是被转为iframe运行,使用的是当前的浏览器 +- 小程序的web-view使用的是小程序自带的浏览器内核,不同厂商不一样,[详见](https://ask.dcloud.net.cn/article/1318) +- App端,Android,使用的是os自带的浏览器内核,在设置-所有应用里,显示系统服务,可查看Android System Webview的版本。在Android5+,系统webview支持安装升级。 +- App端,iOS,是分为UIWebview和WKWebview的,2.2.5+起默认为WKWebview,之前版本[详见](https://ask.dcloud.net.cn/article/36348) + + **注意事项** - `` 组件默认铺满全屏并且层级高于前端组件。App端想调节大小或再其上覆盖内容需使用plus规范。 - `` 组件所在窗口的标题,跟随页面的 `` 值的变化而变化。 -- GitLab