vue，返回上一页面

原创已于 2022-02-21 16:22:29 修改 · 4.9k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#vue.js #elementui #javascript

收录于

于 2021-06-07 15:29:49 首次发布

该博客介绍了一种在前端页面中处理用户点击返回按钮时的逻辑。通过监听`back`图标点击事件，定义`goback`方法检查浏览器历史记录长度。如果历史记录小于等于1，则将用户重定向到首页；否则，执行正常的后退操作。这种方法确保了即使用户在首页，点击返回按钮仍能正常工作。

使用

页面中：

<i class='el-icon-back' @click="goback"/>

在methods中定义方法：

复制代码


goback() {
// 这个判断用来解决这种情况，当用户没有上一条路由的历史记录，出现点击返回按钮没有反应时，下面的代码用来判断有没有上一条路由的历史记录   如果没有则返回首页
  if (window.history.length <= 1) {
    this.$router.push({ path: "/zh-CN/home" });
    return false;
  } else {
    this.$router.go(-1);
  }
}

复制代码