vue修改该项目浏览器顶部图片和title

1,修改项目浏览器的图片

第一步: 在你的项目里面找到public下

public/ favicon.ico文件
到所在目录里面,把你需要的图片放上去,改图片名称为 favicon.ico,把原先的要删除

第二步:在vue.config.js文件中添加,这个文件在vue-cli3.0是没有的,需要手动添加

module.exports = {
 pwa: {
  iconPaths: {
    favicon32: 'favicon.ico',
    favicon16: 'favicon.ico',
    appleTouchIcon: 'favicon.ico',
    maskIcon: 'favicon.ico',
    msTileImage: 'favicon.ico'
  }
}
}

在你的router.js页面,meta里添加title:" 想添加的tltle"
获取你的title的值的话可以用:
document.title
this.pageText = this.$route.meta.title;

main.js 加上 --- 我加在router/index.js
router.beforeEach((to, form, next) => {
window.document.title = to.meta.title == undefined ? '默认标题' : to.meta.title
next()
})

posted @ 2022-07-14 17:50  盘思动  阅读(1387)  评论(0编辑  收藏  举报