1、背景

  由于Vue所生成的项目叫做单页应用,即SPA,如果还是使用jQuery中的go(-)或back()是行不通的,所以,我们使用到了Vue中的编程式导航。

2、基本使用

  • 定义返回按钮:

    <el-button type="primary" plain @click="returnPage">{{$t('message.test.return')}}</el-button>
  • 在methods中定义方法:
    /**
    * [returnPage 返回按钮]
    * @return {[type]} [description]
    */
    returnPage() {
    // 跳转上一级
    // 这个判断用来解决这种情况,当用户没有上一条路由的历史记录,出现点击返回按钮没有反应时,下面的代码用来判断有没有上一条路由的历史记录 如果没有则返回首页
    if (window.history.length <= ) {
    this.$router.push({ path: "/zh-CN/home" });
    return false;
    } else {
    this.$router.go(-);
    }
    }
  • 在Jquery中,我们可以使用以下方法进行返回
    window.history.go(-)

3、遇到的问题

暂无

简述Vue项目中返回上一页的更多相关文章

  1. html中返回上一页的各种写法【转】

    超链接返回上一页代码: <a href="#" onClick="javascript :history.back(-1);">返回上一页</ ...

  2. html中返回上一页

    <a href="<a href="javascript :history.back(-1)">返回上一页</a>或<a href=& ...

  3. vue项目中返回之前页面数据不刷新的问题

    利用vue做项目的时候会有让用户选择当前页面的某些数据,然后再跳到下一页,而下一页是根据上一页的数据来的,有时候选择了上一页的不同选项,下一页的数据可能还是之前的 这个就属于vue的数据获取问题 解决 ...

  4. VUE项目中文件上传兼容IE9

    项目使用VUE编写,UI是ElementUI,但是Element的Upload组件是不兼容IE9的.因为IE9中无法使用FormData. 查找资料基本有两种解决方法:1.引入JQuery和jQuer ...

  5. js中返回上一页失效的解决办法

    最近在做移动端的时候,碰到了一个问题,就是点击返回按键,使用history.go(-1)或history.back(-1)不能够生效.于是便寻找其他的方法,终于找到了一位大神的方法如下: if(win ...

  6. ionic中返回上一页

    .controller('NewsCtrl', ["$scope", "$ionicHistory", "$http","$tim ...

  7. js中返回上一页

    <a class="btn btn-danger" href="javascript:history.go(-1);">取消</a>

  8. vue项目中阻止浏览器返回上一页

    vue项目中在某个页面阻止浏览器返回上一页,适用移动端.PC端. 使用场景例如: 首页 与 A页面     来回跳转,那样点击浏览器返回时也会来回跳转,本想当页面在首页的时候就不再返回了,所以这个时候 ...

  9. vue单页面项目返回上一页无效,链接变化了,但是页面没有变化

    在最近的项目中,返回上一页没有效果,经过好久的排查才发现问题,是路由守卫写法不规范导致. 在项目中用路由守卫做了登录拦截,没登录的跳转到登录页面.页面跳转和拦截都没问题,但是返回上一页就不行了,也没有 ...

随机推荐

  1. Vue项目使用域名访问配置

    1. 编辑C:\Windows\System32\drivers\etc文件夹中的hosts文件,在末尾添加127.0.0.1 www.local.com(你的自定义域名) 注意:如果该文件夹没有ho ...

  2. java数据结构1--数组、排序和Arrays工具类

    数组:Array 数组的定义 数组的内存结构 数组定义常见问题 数组常见操作 Java参数传递问题--值传递 二维数组 1.数组概念 同一种类型数据的集合,可以是基本数据类型,也可以是引用数据类型. ...

  3. windows下查看C语言字符数组(俗称:字符串)在内存中地址信息的操作过程

      #include <stdio.h> #pragma warning(disable:4996) int power10(int n) { ) { ; } ; ; i < n; ...

  4. BZOJ 2731 Luogu P3219 [HNOI2012]三角形覆盖问题 (扫描线)

    题目链接: (bzoj)https://www.lydsy.com/JudgeOnline/problem.php?id=2731 (luogu)https://www.luogu.org/probl ...

  5. 2.Python环境搭建Window、mac、linux

    1.Windows安装Python详解 使用任何高级编程语言都需要有一个自己的编程环境,Python 也不例外.只要使用 Python,就必须要配置 Python 的开发和运行环境. Python 本 ...

  6. SWPU2019 伟大的侦探

    01editor 选择 EBCDIC编码得到压缩包的密码 这里用到的是福尔摩斯里面的跳舞的小人加密 结果是:iloveholmesandwllm

  7. DVWA--CSP Bypass

    0x01看到标题,是否有点疑惑 CPS 是什么东东.简单介绍一下就是浏览器的安全策略,如果 标签,或者是服务器中返回 HTTP 头中有 Content-Security-Policy 标签 ,浏览器会 ...

  8. 【每日一包0006】dedupe

    github地址:https://github.com/ABCDdouyae... dedupe 对数组进行去重,也可以自定义去重(比如要求数组的每一个对象的某个属性不重复) 文档地址:https:/ ...

  9. C# 格式化XML方法

    /// <summary> /// 格式化XML方法 /// </summary> public class UXMLFormat { public static string ...

  10. 使用pycharm编写python乱码

    开始总是乱码,该设置的都设置了,后来用charde检测编码也一直报错,之后重启了pycharm就好了,乱码问题也没了