Skip to content

快速开始

安装请求库

bash
pnpm install @vue3-simple-bui/request

前置依赖

前置依赖说明:使用的主框架要先安装下面的前置依赖

json
["ant-design-vue", "axios", "mitt"]

使用请求库

快速使用

javascript
import { useHttp } from '@vue3-simple-bui/request';

/**
 * 退出操作
 */
import useUserStore from '@/store/modules/user';
import { redirectPortal } from '@/router';
const logoutLogin = () => {
  useUserStore()
    .resetToken()
    .then(() => {
      redirectPortal();
    });
};

const service = useHttp({ baseURL: import.meta.env.VITE_APP_BASE_API }, logoutLogin);

export default service;

其他使用

javascript
import {
  useRequest,
  setDefaultConfig,
  setErrorConfig,
  onTokenExpired,
  usePlugin,
} from '@vue3-simple-bui/request';

// 配置全局默认值
setDefaultConfig({
  baseURL: '/api',
  timeout: 30000,
});

// 配置错误码和提示
setErrorConfig({
  successCode: '0',
  tokenExpiredCode: '1001',
  messages: {
    defaultError: '网络繁忙,请稍后再试!',
    tokenExpired: '您的登录已过期,请重新登录!',
  },
});

// 订阅token过期事件
onTokenExpired(() => {
  console.log('触发退出登录逻辑');
});

// 注册插件
usePlugin((service) => {
  service.interceptors.request.use((config) => {
    console.log('自定义插件: 请求被拦截');
    return config;
  });
});

// 创建请求实例
const service = useRequest(
  {
    headers: {
      'Custom-Header': 'Example',
    },
  },
  () => {
    console.log('登录已过期,执行回调');
  },
);

export default service;

更新发版

修改完相关代码后:

组件库打包

sh
pnpm  run  request:build

组件库发版

打包完成之后修改版本,之后发布:

sh
pnpm  run  request:publish

组件库本地打包

sh
pnpm  run  request:packtgz

更新日志

v1.0.0

😄 content

  • 对统一接口进行封装

❤️ Contributors

更新时间:

基于 MIT 许可发布