vue 获取跳转上一页组件信息

项目中有一需求,需要根据不同的页面路径url跳转进行不同的操作，首先需要获得上一页面的url,利用 beforeRouteEnter 这个钩子中的from参数获得之前url的信息，然后给 next 传递回调来访问当前组件的实例。

操作代码为：

beforeRouteEnter (to, from, next) {console.log(to)console.log(from)if (from.name === null) {//判断是否登录this.isYJLogin()}}，
methods: {isYJLogin(){localStorage.setItem('account', this.code)}
}

如下图所示：

根据打印，也可以用这个name来判断，但是却报个错误：

查看代码，写法没有错误啊，最终查看官方文档，发现官方文档中也有说明：

beforeRouteEnter 守卫不能访问 this，因为守卫在导航确认前被调用,因此即将登场的新组件还没被创建。

可以这样更该下代码如图：

data(){return {newPath:''}},beforeRouteEnter(to, from, next){next(vm => {// 通过 `vm` 访问组件实例,将值传入newPathvm.newPath = from.nameif (from.name === null) {//判断是否登录vm.isYJLogin()}})
}，
methods: {isYJLogin(){localStorage.setItem('account', this.code)}
}

注：beforeRouteEnter这个方法在mounted:function()之后运行。

vue 获取跳转上一页组件信息相关推荐

vue element table列表删除某一页的最后一条数据之后页面不自动跳到上一页
项目场景:element 分页器提示:这里简述项目相关背景: 例如:项目场景:删除某一页的最后一条数据之后页面不自动跳到上一页解决方案: <el-pag ...
vue监听页面上的报错信息,window.onerror和window.addEventListener(‘error‘)的区别
前言: 监听页面上的报错信息项目中使用:判断路径上有没有这个版本号...具体内容可根据实际情况来 const asyncVersion = '20210128' window.addEventLis ...
php 跳回上一页_php – Laravel 5 – 登录后重定向回到上一页
我有一个页面上有一些内容和评论部分.注释只能由已登录的用户保留,因此我已将登录表单添加到页面以供用户登录(仅在他们尚未登录时显示). 我遇到的问题是,当用户登录时,他们会被重定向回主页,而不是他们之前 ...
vue绑定快捷键实现上下翻页
项目是使用vue3 + ts setup(){const prevKeys : string[] = ["ARROWUP", "PAGEUP", "A ...
javascript 获取上一页的url
在js中,如果通过连接或者表单提交里,可以用以下三种方式获取上一页的url: 1.document.referrer 2.top.document.referrer 3.window.parent.d ...
分页输入框跳转 java_displaytag 分页-添加页码输入框跳转至指定页
环境前提:工程引用displaytag-1.2.jar 使用displaytag自动生成的分页修改分页步骤 1.修改配置文件displaytag.properties 原配置文件:displayta ...
taro小程序返回上一页传参
1.在页面跳转上一页前添加 var pages = getCurrentPages();var prevPage = pages[pages.length - 2]; //上一个页面//直接调用上一个 ...
js实现回到上一页的功能,介绍三种方法,其中一种在新开的页面中也适用
话不多说,看例子 1.history.go() 可以回到,前进任意一步的页面,回到上一页,如下所示 // 回到上一页 window.history.go(-1);// 回到下一页 window.his ...
用Python获取Amazon亚马逊的商品信息
引言亚马逊网站相较于国内的购物网站,可以直接使用python的最基本的requests进行请求.访问不是过于频繁,在未触发保护机制的情况下,可以获取我们想要的数据.本次通过以下三部分简单介绍下基本爬 ...
VUE中页面跳转的常用方式及返回上一页实现的两种方式
一.我们知道,如果是一个页面的某些部分切换变化,那不是网页之间的切换,而是子组件的切换:对于页面切换,我们需要知道的是整个页面的内容和路径都发生了改变.在原生JS中我们知道页面切换可以使用locati ...

vue 获取跳转上一页组件信息

vue 获取跳转上一页组件信息相关推荐

最新文章

热门文章