安装

npm install blibee-tools
#or
yarn add blibee-tools

cookie

// 用法
import Cookie from 'blibee-tools/cookie';
componentDidMount() {
  const user_name = Cookie.get('user_name'); // 目前仅支持获取cookie
  if (!user_name) {
    window.location.href = LOGIN_URL;
    return
  }
}

EventBus

// 方法 1: on, 2: emit, 3: off
import EventBus from 'blibee-tools/event-bus';
// on 监听一个事件
function listener(params) {console.log(params)}
EventBus.on('LOADING', listener)
// emit 触发一个事件(必须监听过)
EventBus.emit('LOADING', '事件被触发')
// off 取消对事件的监听
EventBus.off('LOADING', listener)

SearchParse

获取 url 中 query 参数的工具

import SearchParse from 'blibee-tools/search-parse';
const queryMap = SearchParse.parse(location.search);
const queryName = queryMap.get('queryName');// 获取参数

axios

axios 是对 axios 库的封装, 额外增加了 download 和use方法,其他的使用方式一样（依赖axios库）

• axios.use

// 注意事项(必须要写的代码)，要在调用请求前使用一次use方法(全局只需调用一次即可)
import axios from 'blibee-tools/axios';
import { message } from 'antd'; //其他类似的UI库组件都可以，需要有error方法
axios.use(message)

• axios.download

 /**
   * 如果有params 则表明使用的是post请求进行下载 否则是get请求下载
   * @param url 
   * @param filename 
   * @param params 
   */
axios.download(url: string, filename: string, params?: any);

• axios.get

axios.get(url: string, params?: any, config?: any);

• axios.setSuccessCallback()

// 设置请求成功的回调函数, 比如下面的, 前后端约定data的status不为0的时候就是异常情况,并且在data.msg中附带异常信息就可以这么处理
function successCallback(response: AxiosResponse<any>) {
  const { data } = response;
  if (data && data.status) {
    message.error(data.msg);
    response.data = null;
  }
  return response;
}

axios.setSuccessCallback(successCallback)

ToolBox

ToolBox 对象包含两个工具函数，debounce(防抖) 和 throttle(节流)

import ToolBox from 'blibee-tools/ToolBox';

const toolBox = new ToolBox();

toolBox.debounce(fn: Function, delay: number);

toolBox.throttle(fn: Function, time: number);

FormBuilder (antd only)

FormBuilder 是一个高阶组件,允许开发者仅需少量的配置，就可以实现一个表单

使用示例 codesandbox

使用文档