vue router 修改title(IOS 下動態改變title失效)

在ios下app  設置document.title = "titleName" 失效,緣由是在IOS webview中網頁標題只加載一次,動態改變是無效的。html

在路由配置中添加  meta對象 如:ios

 

在路由配置js裏面添如下代碼web

router.afterEach(route => {
    // 從路由的元信息中獲取 title 屬性
    if (route.meta.title) {
        document.title = route.meta.title;
        // 若是是 iOS 設備,則使用以下 hack 的寫法實現頁面標題的更新
        if (navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
            const hackIframe = document.createElement('iframe');
            hackIframe.style.display = 'none';
            hackIframe.src = '/static/html/fixIosTitle.html?r=' + Math.random();
            document.body.appendChild(hackIframe);
            setTimeout(_ => {
                document.body.removeChild(hackIframe)
            }, 300)
        }
    }
});

 在static下添加一個空頁面segmentfault

 

完美解決問題;app

摘抄自 :https://segmentfault.com/a/1190000008853962dom

相關文章
相關標籤/搜索