vue中自动改变页面title的简易方法

       在做项目的时候, 有时候会有这种需求. 就是每跳转一次页面要改变title. 其实这种功能倒不难实现. 作为前端, 都知道document.title = "标题" 就可以改变页面title了. 但如果页面一多起来, 这样每个页面都来一句就很麻烦了. 有没有一种方法, 只在全局写一句就可以实现这个目的. 有的.

      1. 在路由中添加title, 如下:

        {

             path: '/book',

             component: book,

             meta: {title: '斗破苍穹'}

         }

     2. 写一个全局路由钩子, main.js引入, 如下:

      router.beforeEach((to, from, next) => {

           document.title = to.meta.title;

            next();

     })

 

    其实这样就可以了, 但其实还有更复杂的场景. 比如你的title需要等ajax请求回来再设置到页面中.  还有如果要在全局钩子中处理其他逻辑, 一定要了解清楚它的运行机制才行. 否则会被它搞得很难受. 今天先说这么多, 换了新电脑, 打字不方便了.没办法截图了, 全手打几行简单代码.