使用导航守卫改变页面的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. [转帖]Strace + pstack发现耗时点

    https://www.jianshu.com/p/10ea6fff562c 如何使用strace+pstack利器分析程序性能 本文摘抄自如何使用strace+pstack利器分析程序性能 程序说明 ...

  2. ABP vNext系列文章04---DynamicClient动态代理

    一.动态代理在ABP系统中的应用 1.它主要在做什么事件 之前开发系统想要在后台调用别的服务都是用HttpClient发起请求,在abp vnext中不需要我们这样做了, 你只要知道服务调用的接口方法 ...

  3. border多层渐变

    .content { margin-top: 19px; border-top: 1px dashed rgba(113, 183, 248, 0.6) !important; border-left ...

  4. 【一】LaTeX的安装和使用、安装TeXstudio、中文界面输出设置

    安装方法一:(推荐) 下载链接·:http://tug.org/texlive/acquire-netinstall.html 下载zip,然后运行Windows批处理脚本(install-tl-wi ...

  5. 5.11 汇编语言:仿写IF条件语句

    条件语句,也称为IF-ELSE语句,是计算机编程中的一种基本控制结构.它允许程序根据条件的真假来执行不同的代码块.条件语句在处理决策和分支逻辑时非常有用.一般来说,条件语句由IF关键字.一个条件表达式 ...

  6. SpringCloud-04-http客户端Feign

    http客户端Feign 1.Feign的介绍 Feign是一个声明式的http客户端,官方地址:https://github.com/OpenFeign/feign 其作用就是帮助我们优雅的实现ht ...

  7. 解决线程不安全的方式(Java)

    一.同步代码块 package com.synchronized1; // 买票示例 // 使用同步代码块解决线程安全问题 public class TicketRunnableImp impleme ...

  8. Android 开机流程介绍

    目录 一.目的 二.环境 三.相关概念 3.1 Android平台架构 3.2 Android启动架构 3.3 zImage 3.4 RAMDISK 3.5 RC文件 四.详细设计 4.1 Boot ...

  9. TfrxReport.Clear。尽量慎用。

    for MyXuHaoKey in MyXuHaoJianRongSanJieKouDataDicApi.KeySortList do begin //标记下打印编号,吸入淘打的客户 MyTradeA ...

  10. Kafka-合理设置broker、partition、consumer数量

    1.broker的数量最好大于等于partition数量 一个partition最好对应一个硬盘,这样能最大限度发挥顺序写的优势. 一个broker如果对应多个partition,需要随机分发,顺序I ...