网页在切换的时候,网页顶部显示自定义网页名称的方法:

 

 具体方法如下:在router下的index.js文件中配置

{

    path: '/feifan',

    component: () => import("../views/FeiFan.vue"),

 //meta 固有属性称为元数据:可以存放各种自定义内容

    meta: {title: '非凡'}

  },

const router = new VueRouter({

  mode: 'history',

  base: process.env.BASE_URL,

  routes

})

//必须在router赋值后,手写代码,上方代码就是路由赋值

//路由前置守卫-监听路由的各种跳转操作,在路由跳转前触发

router.beforeEach((to, from, next) => {

 console.log('to:', to);//要前往的路由信息

  console.log('from:', from);//当前页面的路由信息

  // 将元数据meta中的title 赋值给网页头部的标题

  document.title = to.meta.title

  next(); //放行,允许路由继续运行

})

export default router

这样就轻松搞定,网页名称就展示出来了