给vue动态添加seo及title

vue对seo不是很友好，需要添加配置及实现方案：具体内容如下---
https://segmentfault.com/a/1190000019623624

image.png

在index.html内添加title,meta。

image.png

在路由内添加title，content配置

image.png
若添加if判断，在created内修改样式。
image.png

添加拦截器

router.beforeEach((to, from, next) => {
  /* 路由发生变化修改页面meta */
  console.log(to.meta.content)
  if(to.meta.content){
  let head = document.getElementsByTagName('head');
  let meta = document.createElement('meta');
  document.querySelector('meta[name="keywords"]').setAttribute('content', to.meta.content.keywords)
  document.querySelector('meta[name="description"]').setAttribute('content', to.meta.content.description)
  meta.content = to.meta.content;
  head[0].appendChild(meta)
  }
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title
  }
  /*当进行页面跳转时定位在页面顶部*/
  // chrome
  document.body.scrollTop = 0
  // firefox
  document.documentElement.scrollTop = 0
  // safari
  window.pageYOffset = 0
  next()
})