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請求回來再設置到頁面中.  還有如果要在全局鉤子中處理其他邏輯, 一定要了解清楚它的運行機制才行. 否則會被它搞得很難受. 今天先說這麼多, 換了新電腦, 打字不方便了.沒辦法截圖了, 全手打幾行簡單代碼.