vue-meta-info

1.  npm:

npm install vue-meta-info --save


2.全局引入 vue-meta-info

import Vue from 'vue'
import MetaInfo from 'vue-meta-info'

Vue.use(MetaInfo)
3.组件内静态使用 metaInfo

<template>
  ...
</template>

<script>
  export default {
    metaInfo: {
      title: 'My Example App', // set a title
      meta: [{                 // set meta
        name: 'keyWords',
        content: 'My Example App'
      }]
      link: [{                 // set link
        rel: 'asstes',
        href: 'https://assets-cdn.github.com/'
      }]
    }
  }
</script>


4.如果你的 title 或者 meta 是异步加载的，那么你可能需要这样使用



<template>
  ...
</template>

<script>
  export default {
    name: 'async',
    metaInfo () {
      return {
        title: this.pageName
      }
    },
    data () {
      return {
        pageName: 'loading'
      }
    },
    mounted () {
      setTimeout(() => {
        this.pageName = 'async'
      }, 2000)
    }
  }
</script>

确定大于优点，不推荐使用。