vue-meta-info 使用方法

1. 安裝 vue-meta-info
   npm i vue-meta-info --save
2. 使用
   在 main.js 文件中引入 vue-meta-info
   import MetaInfo from 'vue-meta-info';
   組件內靜態使用 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> 

組件內動態使用 metaInfo ：這種方式可以動態生成META標簽的內容，一般META標簽的內容需要根據變量去變化的時候，可以選用這種方式。

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

作者：帶刀打天下
鏈接：https://www.jianshu.com/p/50a8449a62c8
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。