鍍金池/ 問答/iOS  HTML/ 蘋果手機 瀏覽器中修改vue單頁面的title

蘋果手機 瀏覽器中修改vue單頁面的title

最近在弄一個h5的項目，使用vue的框架，但是遇到一個小麻煩，頁面的title如何修改，經(jīng)過查詢：

/* 路由發(fā)生變化修改頁面title */
router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title
    // 如果是 iOS 設(shè)備，則使用如下 hack 的寫法實現(xiàn)頁面標題的更新
    // 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)
    // }
    // var iframe = document.createElement('iframe');
    // iframe.style.visibility = 'hidden'; 
    // iframe.style.width = '1px'; 
    // iframe.style.height = '1px'; 
    // iframe.onload = function () { 
    //     setTimeout(function () {
    //         document.body.removeChild(iframe); 
    //     }, 0); 
    // }; 
    // document.body.appendChild(iframe);
  }
  next()
});

如上代碼，測算如下
安卓手機，微信+瀏覽器，都ok
蘋果手機，微信瀏覽器ok，自帶的safari瀏覽器，顯示的是ip地址

回答
編輯回答
脾氣硬

之前用的代碼跟你差不多，可以試一下

var $body = $('body')
var $iframe = $('<iframe src="/favicon.ico" width="1px" height="1px" style="display:none;"></iframe>')
$iframe.on('load',function() {
    setTimeout(function() {
        $iframe.off('load').remove();
    }, 0)
}).appendTo($body)
2017年7月8日 11:04
編輯回答
拽很帥

樓主這個問題解決了嗎?今天也遇到了這個問題,在safari 上顯示的是網(wǎng)址,不是title

2017年4月26日 19:27