钉钉内置的浏览器怎么改变title

在我项目的开发过程当中,遇到过在钉钉打开的vue写的h5页面,通过在路由切换的时候通过全局的路由钩子函数改变 document.title 的内容失效的问题。

const routes = [
  {
    path: '/',
    name: 'home',
    meta:{
      title:"title1"
    },
  },
  {
    path:'/down',
    name:"down",
    meta: {
      title: 'title2'
      },
  },
]

const router = new VueRouter({
  routes
})

router.beforeEach((to, from, next) => {
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  //必须有next 不然路由切换不了
  next()
});

解决方法

经过了解,我们可以通过引入一个全局的js对象dd来设置钉钉内部的 document.title

// 1.引入js
<script src="http://g.alicdn.com/dingding/dingtalk-jsapi/2.3.0/dingtalk.open.js"></script>

//或者查看钉钉开发手册,里面有一个包
npm install dingtalk-jsapi --save 
import * as dd from 'dingtalk-jsapi'; // 此方式为整体加载,也可按需进行加载


// 2.改变title
      dd.ready(function() {
    dd.biz.navigation.setTitle({
      title: "123", 
    })
  })
原文地址:https://www.cnblogs.com/Rembang/p/13215098.html