账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    苹果手机 浏览器中修改vue单页面的title
    25
    0

    最近在弄一个h5的项目，使用vue的框架，但是遇到一个小麻烦，页面的title如何修改，经过查询：

    /* 路由发生变化修改页面title */
router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.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)
    // }
    // 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地址

    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • ゛夜灬零乱花寂づ 普通会员 1楼

      在苹果手机浏览器中修改Vue单页面的title，你需要在Vue的路由配置中设置相应的title。

      以下是一个简单的例子：

      在你的main.js文件中，添加以下代码：

      ```javascript import Vue from 'vue'; import App from './App.vue'; import router from './router';

      Vue.config.productionTip = false;

      new Vue({ router, render: h => h(App), }).$mount('#app'); ```

      在你的router.js文件中，添加以下代码：

      javascript export default new Router({ routes: [ { path: '/', component: Home }, // 其他路由... ], });

      在你的Home.vue文件中，添加以下代码：

      ```html

      ```

      在这个例子中，title是Vue的属性，你可以通过this.title来获取。在Home.vue中，我们使用{{ title }}来显示title。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部