简述Vue项目中返回上一页

1、背景

  由于Vue所生成的项目叫做单页应用，即SPA，如果还是使用jQuery中的go（-1）或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 <= 1) {
      this.$router.push({ path: "/zh-CN/home" });
      return false;
    } else {
      this.$router.go(-1);
    }
  }

• 在Jquery中，我们可以使用以下方法进行返回

  window.history.go(-1)

3、遇到的问题

  暂无