-
vue-meta-info 使用方法
- 安装 vue-meta-info
npm i vue-meta-info --save
- 使用
在 main.js 文件中引入 vue-meta-info
import MetaInfo from 'vue-meta-info';
组件内静态使用 metaInfo
组件内动态使用 metaInfo :这种方式可以动态生成META标签的内容,一般META标签的内容需要根据变量去变化的时候,可以选用这种方式。<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>
<template> ... </template> <script> export default { name: 'async', metaInfo () { return { title: this.pageName } }, data () { return { pageName: 'loading' } }, mounted () { setTimeout(() => { this.pageName = 'async' }, 2000) } } </script>
- 安装 vue-meta-info
网友评论