获取vue-router的上一个页面是否存在或者是否是自己需要返回的地址,可以使用vue-router的的声明周期函数,有三种模式:

第一种、使用全局函数beforeEach,直接来获取form.path(即为对应的上一次地址的路由path内容);

beforeEach(to, from, next) {
path = from.path //path为定义的变量,不是vue的data定义的变量,当前生命周期data还未初始化
next()
}

第二种、使用组内共享函数beforeEnter,直接来获取form.path(即为对应的上一次地址的路由path内容);

beforeEnter(to, from, next) {
path = from.path //path为定义的变量,不是vue的data定义的变量,当前生命周期data还未初始化
next()
}

第三种、使用组件内函数,beforeRouteEnter,,直接来获取form.path(即为对应的上一次地址的路由path内容);

beforeRouteEnter(to, from, next) {
path = from.path //path为定义的变量,不是vue的data定义的变量,当前生命周期data还未初始化
next()
}

vue-router如何做历史返回提示?的更多相关文章

  1. vue router.push(),router.replace(),router.go()和router.replace后需要返回两次的问题

    转载:https://www.cnblogs.com/lwwen/p/7245083.html https://blog.csdn.net/qq_15385627/article/details/83 ...

  2. python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

  3. (转)vue router 如何使用params query传参,以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  4. [Vue 牛刀小试]:第十四章 - 编程式导航与实现组件与 Vue Router 之间的解耦

    一.前言 在上一章的学习中,通过举例说明,我们了解了 Vue Router 中命名路由.命名视图的使用方法,以及如何通过 query 查询参数传参,或者是采用 param 传参的方式实现路由间的参数传 ...

  5. vue router 如何使用params query传参,以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  6. Springboot+Vue实现仿百度搜索自动提示框匹配查询功能

    案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...

  7. 深入浅出的webpack构建工具--webpack4+vue+router项目架构(十四)

    阅读目录 一:vue-router是什么? 二:vue-router的实现原理 三:vue-router使用及代码配置 四:理解vue设置路由导航的两种方法. 五:理解动态路由和命名视图 六:理解嵌套 ...

  8. vue spn如何做seo优化

    vue spn如何做seo优化 突然来了一个需求,对已有的项目做SEO优化,WHAT? 总所周知,spn对seo不够优化,因而官方考虑到直接使用ssr 一个不算解决办法的办法prerender-spa ...

  9. vue router使用query和params传参的使用

    传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,希望可以帮到大家. Vue ...

随机推荐

  1. P3952 NOIP2017 时间复杂度

    写了两三个小时,麻烦倒是不麻烦,要考虑清楚,想全了 只过了样例提交是不是傻,要自己造数据 数据不大可以用STL 建议自己刚一下,不看代码 #include <iostream> #incl ...

  2. Shell变量知识进阶

    一,Shell中特殊且重要的变量 $0结合dirname和basename分别取出脚本名称和脚本路径 [root@192-168-3-163 scripts]# cat test.sh #!/bin/ ...

  3. Unity3D学习笔记(八):四元素和书籍推荐

    书籍推荐: 3D数学基础:图形与游戏开发——游戏软件开发专家系列(美)邓恩 Unity Shader入门精要 冯乐乐(92年) 数据结构(Python语言描述) 数据结构.算法与应用(C++语言描述) ...

  4. The way to Go(4): Go runtime及解释器

    Reference: Github: Go Github: The way to Go Go runtime Go runtime: 尽管 Go 编译器产生的是本地可执行代码,这些代码仍旧运行在 Go ...

  5. 【hbuilder】如何根据Geolocation获得的坐标获取所在城市?

    第一步通过mui.plusReady[表示页面加载事件]调用hbuilder提供的百度定位 mui.plusReady(function() { plus.geolocation.getCurrent ...

  6. 趣味工具figlet

    sudo apt-get install figlet $ echo "Hello" | figlet _ _ _ _ | | | | ___| | | ___ | |_| |/ ...

  7. angular5 表单元素 checkbox radio 组讲解

    一.checkedbox 1.ngModel绑定方式 <input [(ngModel)]="item.checked" value="item.checked&q ...

  8. ehcache入门基础示例

    一:目录 EhCache 简介 Hello World 示例 Spring 整合 二: 简介 1. 基本介绍 EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernat ...

  9. Phalcon框架数据库读写分离的实现方法

    Phalcon框架和Yaf类似,是一款用C实现的拓展级别的框架,不过其功能实现更加丰富,设计思路基于依赖注入.容器等方式,更符合现代框架思想.本文主要针对Phalcon框架数据库层的读写分离进行说明, ...

  10. WPF样式——经典博客

    WPF样式博客:http://www.cnblogs.com/luluping/archive/2011/05/06/2039498.html