使用导航守卫改变页面的title时报错了，明明在beaforeEach的参数中写了箭头函数也报下面的错误

后面发现我的问题在于直接导出了export.default new Router({……})中的内容，然后写的Router.beforeEach，直接给Router这个路由插件使用了beforeEach，应该给声明的路由实例添加beforeEach方法才对，使用const router = new Router({……}) 然后使用router.beforeEach就可以了，具体写法如下

next（）是函数体所必须的，支持路由往下跳转的回调，to和from的意思就是从(from)哪个路由跳转到(to)哪个路由去，但是有些时候按照to.meta可能会取不到元数据，比如有路由的嵌套也就是routers中含有children的时候

将to打印出来，to中有一个mached，是一个数组，在[0]的位置可以看到我们在路由中定义的元数据meta

在实际项目中方法里面最好写document.title=to.matched[0].meta.title

Vue.beforeEach is not a function报错的更多相关文章

  1. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  2. Vue学习笔记-vue-element-admin 按装报错再按装

    一  使用环境 开发系统: windows 后端IDE: PyCharm 前端IDE: VSCode 数据库: msyql,navicat 编程语言: python3.7  (Windows x86- ...

  3. Vue入门之旅：一报错 Unknown ... make sure to provide the "name" option及error compiling template

    报错一: Unknown custom element: <custom-select> - did you register the component correctly? For r ...

  4. vue项目中使用echarts map报错Cannot read property 'push' of undefined nanhai.js

    在vue中绘制地图需要加载一个本地china.json文件,我用的是get请求的方法加载的,而不是直接import,因为我怕import请求到的部署到线上的时候会有问题.如下是get请求方法: thi ...

  5. vue 将值存储到vuex 报错问题

    报错 :Vuex - Computed property “name” was assigned to but it has no setter 如何解决: computed: { addModal: ...

  6. angularjs 遇见$scope,xxx=function()报错为该函数未定义

    本包子今天遇见一个问题,就是明明写了$scope,xx=function()但是报错了,报错显示是该函数未定义,我就很着急的先将函数写成一个全局函数,就没问题,等下午有空的时候寻思了一下,为什么全局就 ...

  7. 微信小程序中 this.setData is not a function报错

    在微信小程序中我们一般通过以下方式来修改data中的数据: 比如获取小程序缓存: wx.getStorage({ key: 'is_screen', success: function (res) { ...

  8. _self.$scopedSlots.default is not a function报错

    问题: 当同一页面有elementUI的多个table表格时,如果用到v-if来动态展示表格,切换时出现如下报错: 原因: 是因为表格是element-ui通过循环产生的,而vue在dom重新渲染时有 ...

  9. vue安装遇到的5个报错小结

    前言 这篇博文不会教你怎么安装vue,但会告知安装过程中可能遇到的5个问题 2017年我写过一篇安装vue的博客,详情:https://www.cnblogs.com/tu-0718/p/752109 ...

  10. Nuxt.js vue init nuxt-community/koa-template 初始化项目报错

    报错提示: Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functi ...

随机推荐

  1. TCP内核参数的简单验证

    前言 春节假期时学习了下内核参数与nginx的调优 最近因为同事遇到问题一直没有解,自己利用晚上时间再次进行验证. 这里将几个参数的理解和验证结果简单总结一下. 希望能够在学习的过程中将问题解决掉. ...

  2. Mysql数据库查看Database的大小的方法

    最简单的方法为: select concat(round(sum(data_length/1024/1024),2),'MB') as data from INFORMATION_SCHEMA.tab ...

  3. CDP技术系列（一）：使用bitmap存储数十亿用户ID的标签或群体

    一.背景介绍 CDP系统中目前存在大量由用户ID集合组成的标签和群体,截止当前已有几千+标签,群体2W+. 大量的标签都是亿级别数据量以上,例如性别.职业.学历等均,甚至有群体中的ID数量达到了数十亿 ...

  4. echarts中坐标与标签刻度对齐

    xAxis: { data: ["土地.房屋及建筑物", "遇用设备", "遇用设备", "裤子", "家具. ...

  5. 【小优化】golang中取两个字符串的公共前缀的长度

    作者:张富春(ahfuzhang),转载时请注明作者和引用链接,谢谢! cnblogs博客 zhihu Github 公众号:一本正经的瞎扯 在VM的merge部分的代码中发现这样一个函数: func ...

  6. 【0基础学爬虫】爬虫基础之自动化工具 Playwright 的使用

    大数据时代,各行各业对数据采集的需求日益增多,网络爬虫的运用也更为广泛,越来越多的人开始学习网络爬虫这项技术,K哥爬虫此前已经推出不少爬虫进阶.逆向相关文章,为实现从易到难全方位覆盖,特设[0基础学爬 ...

  7. Linux下rz命令上传文件失败处理

    在Linux服务器上使用rz命令上传文件时,有时候会遇到文件上传失败,此时会在当前目录下生成一堆大小为0的乱码文件,如下图所示: 这些文件有时候rm命令也无法删除,下面提供两种通过find命令删除的方 ...

  8. Xmind永久会员版本

    Xmind软件不要多介绍了思维导图最好用的软件 PJ后可以直接使用高级版本功能如图 使用方式 下载我们提供的版本和.dll即可如图 点击Xmind安装默认C盘不可以自定义位置 安装完成后进入patch ...

  9. windows10卸载小娜

    适用于2004版本往后的 win+x如图 输入如下代码 Get-AppxPackage-allusersMicrosoft.549981C3F5F10|Remove-AppxPackage 运行结束后 ...

  10. 8.6 C++ 泛型化编程态

    C/C++语言是一种通用的编程语言,具有高效.灵活和可移植等特点.C语言主要用于系统编程,如操作系统.编译器.数据库等:C语言是C语言的扩展,增加了面向对象编程的特性,适用于大型软件系统.图形用户界面 ...