web
v0.5+
<web>
用于在 weex 页面中显示由 src
属性指定的页面内容。您还可以使用 webview
模块来控制 WebView 的行为,例如回退、前进和重新加载,更多信息请参见 webview module。
基本用法
注意:
<web>
不支持任何嵌套的子组件,并且必须指定width
和height
的样式属性,否则将不起作用。
<web src="https://vuejs.org"></web>
参见示例.
属性
属性 | 类型 | 值 | 默认值 |
---|---|---|---|
src |
String | {URL} | - |
src
要加载的网页内容的 URL。您可以指定一个基于 bundle URL 的相对 URL,它将被重写为真实资源 URL(本地或远程)。另请参阅:Path。
事件
只支持公共事件中的 appear
和 disappear
事件。
pagestart
pagestart
事件,会在 Web 页面开始加载时调用。
事件对象:
url
: {String} 当前 Web 页面的 URL。
pagefinish
pagefinish
事件,会在 Web 页面完成加载时调用。
事件对象:
url
: {String} 当前 Web 页面的 URL。canGoBack
: {Boolean} 当前 Web 页面是否可以回退。canGoForward
: {Boolean} 当前 Web 页面是否可以前进。title
: {String} 当前 Web 页面的标题(仅限 iOS 平台)。
error
error
事件,会在 Web 页面加载失败时调用。
receivedtitle
error
事件,会在 Web 页面的标题发生改变时调用(仅限 Android 平台)。
事件对象:
url
: {String} 当前 Web 页面的 URL。
处理 <web>
事件
在 <web>
上绑定事件:
<web @pagestart="onPageStart" @pagefinish="onPageFinish" @error="onError" src="https://vuejs.org"></web>
添加事件 handler:
export default {
methods: {
onPageStart (event) {
// page start load
},
onPageFinish (event) {
// page finish load
},
onError (event) {
// page load error
},
}
}
参见示例。
样式
支持公共样式。
使用注意事项
- 必须指定
<web>
的width
和height
样式。 <web>
不能包含任何嵌套的子组件。- 您可以使用 webview module 来控制
<web>
组件,参见示例。