Vent-App/pages/common/exit.vue

<template>
  <view>
    <scroll-view
      :scroll-y="modalName == null"
      class="page"
      :class="modalName != null ? 'show' : ''"
    >
      <cu-custom bgColor="bg-gradual-pink" :isBack="false">
        <!-- <block slot="backText">返回</block> -->
        <block slot="content">退出页</block>
      </cu-custom>
      <view class="solids-bottom padding-xs flex align-center">
        <view class="flex-sub text-center">
          <view class="solid-bottom text-xsl padding">
            <text class="cuIcon-roundcheckfill text-green"></text>
          </view>
          <view class="padding">{{ item.msg }}</view>
        </view>
      </view>
      <view class="padding flex flex-direction">
        <button class="cu-btn bg-green shadow-blur round lg" @tap="goback()">
          返回登录
        </button>
      </view>
    </scroll-view>
  </view>
</template>

<script>
import api from "@/api/api";
import { ACCESS_TOKEN, USER_NAME, USER_INFO } from "@/common/util/constants";

export default {
  data() {
    return {
      modalName: null,
      item: { msg: "退出成功" },
      jumping: false, // 防止重复点击导致连续跳转
    };
  },
  onLoad: function (option) {
    const logoutToken = uni.getStorageSync(ACCESS_TOKEN);
    const logoutRequest = api.logout(logoutToken);
    console.log(logoutToken, "token");
    this.clearLoginState();
    logoutRequest.catch(() => {
      console.error("退出登录请求失败");
    });
  },
  onBackPress() {
    return true;
  },
  methods: {
    clearLoginState() {
      [
        ACCESS_TOKEN,
        USER_NAME,
        USER_INFO,
        "menuPermission",
        "btnPermission",
      ].forEach((key) => {
        uni.removeStorageSync(key);
      });
      this.$store.commit("SET_TOKEN", "");
      this.$store.commit("SET_NAME", { username: "", realname: "" });
      this.$store.commit("SET_DICT", "");
    },
    goback() {
      // 避免重复点击/与 401 跳转叠加，造成 do not operate continuously
      if (this.jumping) {
        return;
      }
      this.jumping = true;
      // 退出登录后清空页面栈，否则登录页侧滑会回到系统内部页面
      uni.reLaunch({
        url: "/pages/login/login",
        complete: () => {
          setTimeout(() => {
            this.jumping = false;
          }, 800);
        },
      });
    },
  },
};
</script>

<style>
</style>