vue设置title和ioc图标

Posted 2020-11-03 莫小龙

vue设置ioc图标和title

1.ioc图标设置

在根目录中的index.html中引入代码：

<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" rel="external nofollow" /> 

2.title设置

首先在根目录中的index.html中加入代码：

<title>标题</title>

这样每个页面的标题都相同，不同页面的标题定制推荐使用 vue-wechat-title插件

1.安装插件

npm install vue-wechat-title

2. 在 main.js 中加入

import VueWechatTitle from \'vue-wechat-title\';  
Vue.use(VueWechatTitle)

3. 路由中加下 title

{
      path: \'/Login\',
      /* *  按需加载   */
      component: (resolve) => {
        require([\'@/components/Login.vue\'], resolve)
      },
      meta: {
        title: \'登录\'
      }
    }
}

4. 在app.vue 中修改 router-view ，加入他的这个组件

<router-view v-wechat-title="$route.meta.title"></router-view> 

正常的话，你再访问就能看到自己写的标题了

 

 

 

参考自：https://www.cnblogs.com/jshare/p/7421670.html