alibaba / ice

🚀 ice.js: The Progressive App Framework Based On React(基于 React 的渐进式应用框架)
https://ice.work
MIT License
17.83k stars 2.09k forks source link

appts中无法正确的使用history #6908

Closed sunshineLi2019 closed 3 months ago

sunshineLi2019 commented 3 months ago

Describe the bug

export const requestConfig = defineRequestConfig({
  baseURL: "/api",
  // withCredentials: true,
  // 拦截器
  interceptors: {
    response: {
      onError: (error) => {
        if (error.response && error.response.status === 500) {
          history.pushState(null, "", "/login");
        }
        return Promise.reject(error);
      },
    },
  },
});

我期望在所有的请求中,当token失效的时候跳转到登录页,然而history在appts中是未加载的null. image 我使用了官方文档的处理方式

import { history } from "ice";

export function linkto(link: string) {

  if (history !== null) {
    // 在这里使用 myHistory 变量
    history.push(link);
  }
}

Expected behavior

我期望获取到history

Actual behavior

实际上仍然为null. 我现在只能使用原生js的history进行路由跳转,但是这并不优雅. 我希望获取到合适的解决方案.用于处理当token失效的时候跳转到登录页这个需求.

Version of ice.js

3.4.8

Content of build.json or ice.config.mts

import { defineConfig } from "@ice/app";
import request from "@ice/plugin-request";
import store from "@ice/plugin-store";
import auth from "@ice/plugin-auth";
import i18n from "@ice/plugin-i18n";
import antd from "@ice/plugin-antd";
// The project config, see https://v3.ice.work/docs/guide/basic/config
const minify = process.env.NODE_ENV === "production" ? "swc" : false;
export default defineConfig(() => ({
  ssg: false,
  minify,
  routes: {
    ignoreFiles: [
      "**/pages/**", 
      "**/components/**", 
      "**/services/**",
    ],
  },
  plugins: [
    request(),
    store(),
    auth(),
    i18n({
      locales: ["zh-CN"],
      defaultLocale: "zh-CN",
    }),
  ],
  compileDependencies: false,
}));

Additional context

No response

ClarkXia commented 3 months ago

补充下 ice.config.mts 配置

sunshineLi2019 commented 3 months ago

补充下 ice.config.mts 配置

你好,已经更新了信息

ClarkXia commented 3 months ago

image image 使用了延迟 100 ms 的方式输出,暂时无法复现你的问题

sunshineLi2019 commented 3 months ago

@ClarkXia image 当我使用defineDataLoader的时候页面会加载两次,无法正确的获取到history. 当我在app.ts请求拦截defineDataLoader的请求的时候history无法正确加载,其他页面的请求可以正确的使用history进行跳转

ClarkXia commented 3 months ago

@sunshineLi2019 dataLoader 仅打包请求相关逻辑,因此入口 history 初始化等逻辑均未执行,后续我们在文档中标注下