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. 拯救诺基亚X6

    现象:充电不稳,冲不进去电,后来直接黑屏了. 维修方式:更换手机尾插.或者更换整个尾插小板. 手机主板应该没有问题,这是本人某友的手机,据了解磕碰进水等问题.先前先后因为此问题找手机店,维修过两次,费 ...

  2. idea+maven3.6.1构建maven工程报PKIX:unable to find valid certification path to requested target

    转载于  https://www.cnblogs.com/xiaoping1993/p/9717649.html 注意可能在idea工具执行java命令提示找不到类,返回类的最上层包路径 然后再执行j ...

  3. 微信小程序-饮食日志_开发记录02

    此段时间主要写功能的实现. 内部的增删改查等内容. 主要有食物查找.运动选择.身高体重比例计算等.

  4. JavaScript精进篇

    JavaScript是所有前端框架中最基础的框架,在工作了两年以后又重新回到了这里.过去两年里用的最多的前端框架是jquery,因为它简单易上手,而jquery就是封装了JavaScript.重新系统 ...

  5. 引用自定义的css或者js文件

    用script标签,src是js文件路径 <script type="text/javascript" src="./js/udc.js">< ...

  6. kvm:双网卡做bond+桥接

    一,KVM基础 kvm是一种技术,云计算是一种模式,虚拟化是利用相应的技术方法在一台物理机器上将其按照不同的需求划分成多个相同或者不同的虚拟操作系统,并且各个虚拟系统可以同时运行,互不干扰,其中任何一 ...

  7. 创建一个简单的 Springboot web项目

    1.点击Project 2.点击 Next 3.项目名 4.web 项目 4.确认 5.pom.xml <?xml version="1.0" encoding=" ...

  8. 【方法】原生js实现方法ajax封装

    /* 参数说明* type[String] 请求方式('POST'或'GET') 默认设置'GET'方式* dataType[String] 获取到的后台数据格式 默认'JSON'格式* async[ ...

  9. 上传200G文件

    最近遇见一个需要上传百G大文件的需求,调研了七牛和腾讯云的切片分段上传功能,因此在此整理前端大文件上传相关功能的实现. 在某些业务中,大文件上传是一个比较重要的交互场景,如上传入库比较大的Excel表 ...

  10. UI编辑

    UI编辑 基本部件介绍 (1)Layout(布局) (2)Space(空间) (3)Button (4)ItemView (5)ItemWidget Widget继承自View,即ListWidget ...