做了一个列表的h5页面,通过点击列表跳转到外部链接,然后返回是回到原来页面状态,类似缓存。发现在ios端返回后,vue 的mounted() 、create()、路由监听等方法都不会执行。在安卓和pc 端都能正常调用。
解决方案:监听pageshow
mounted(){
const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
if(isiOS) {
window.addEventListener('pageshow', () => {
//回退到vue应用执行的操作
this.init();
});
} else {
this.init();
}
},
pageshow(MDN) :
当一条会话历史记录被执行的时候将会触发页面显示 (pageshow) 事件。(这包括了后退/前进按钮操作,同时也会在 onload 事件触发后初始化页面时触发)。
属性
Property | Type | Description |
---|---|---|
target 只读 | EventTarget | The event target (the topmost target in the DOM tree). |
type 只读 | DOMString | The type of event. |
bubbles 只读 | Boolean | Whether the event normally bubbles or not. |
cancelable 只读 | Boolean | Whether the event is cancellable or not. |
persisted 只读 | boolean | 表示网页是否是来自缓存。 |