open-index/open-npm huggingface dataset:
npm package: @kuikuifly/kk-ui
Description: A react library developed with dumi
Latest version: 0.0.1

# kk-ui

[![NPM version](https://img.shields.io/npm/v/kk-ui.svg?style=flat)](https://npmjs.org/package/kk-ui)
[![NPM downloads](http://img.shields.io/npm/dm/kk-ui.svg?style=flat)](https://npmjs.org/package/kk-ui)

A react library developed with dumi

## Usage

TODO

## Options

TODO

## Development

```bash
# install dependencies
$ yarn install

# develop library by docs demo
$ yarn start

# build library source code
$ yarn run build

# build library source code in watch mode
$ yarn run build:watch

# build docs
$ yarn run docs:build

# check your project for potential problems
$ yarn run doctor
```

## LICENSE

MIT
npm package: @kuimo/api-generator
Description: 基于`typescript`与`axios`的 API 接口方法生成器
Author: McDaddy
Latest version: 1.0.20

# api-generator

基于`typescript`与`axios`的 API 接口方法生成器

## 特性

- Restful API 规范实现
- 强制使用者为接口提供入参与出参的 ts 类型
- 自动生成一个基于 axios 调用的接口函数
- 自定义使用场景

## 如何使用

1. 定义 api

```typescript
// service.ts
import apiGenerator from '@kuimo/api-generator';

interface GetListParams {
  pageNo: number;
  pageSize: number;
  searchKey?: string;
}

interface Item {
  name: string;
}

interface PagingData<T> {
  list: T[];
  total: number;
}

export const getList = apiGenerator<(p: GetListParams) => PagingData<PACKAGE.PackageDef>>({
  api: '/api/getList',
});
```

2. 调用接口

```typescript
// page.tsx
import { getList } from './service';

...
const fetchData = async () => {
   const list = await getList({ pageNo, pageSize });
   return list;
}
...

```

## 配置

### api

接口url字符串。

支持参数匹配，通过`:param`的形式做匹配，运行时会自动将参数填入url中

```typescript
export const submitData = apiGenerator<(p: { id: string }) => void>({
  api: '/api/submit/:id',
});
```

### method

默认为`GET`, 如果是get请求可以省略

### $options

在运行时使用接口时，可以传入一个`$options`参数，来处理特殊场景

#### successMsg/ErrorMsg

传入一个成功或失败的字符串，提供自动信息提示。**前提**：需要调用`initApiGenerator`来注册成功失败行为

```typescript
const submitData = async () => {
  await postData({ params, $options: { successMsg: '操作成功' } });
};
```

#### isMultipart

当请求类型是`multipart/form-data`时，使用`$options: { isMultipart: true }` 只需要传入`kv`对象即可，生成方法里会自动包装`formData`

#### rawResponse

当需要拿到最原始的`axios`返回体时，使用`$options: { rawResponse: true }`， 即可或者原始返回

#### axiosConfig

支持传入任意 axios request 参数，用于特殊场景或覆盖默认配置

```typescript
// 例如得到监听上传进程的回调
const submitData = async () => {
   await postData({ params, $options: { axiosConfig: axiosConfig: {
        onUploadProgress: (e: ProgressEvent) => onProgress({ loaded: e.loaded, total: e.total }),
     }} 
   });
}
```

### initApiGenerator

初始化方法，在项目入口使用

#### onSuccess/onError

指定成功或失败请求的回调操作


#### dataPropertyName

大多数时候，我们都会有一个统一的接口返回结构体，如:

```js
{
    code: number;
    data: T;
    error?: string;
}
```

而我们一般只关注实际的数据返回，即上面的`data`部分，可以使用`dataPropertyName`来指定数据属性，这样返回的结果就只有数据部分了


```typescript
import { initApiGenerator } from '@kuimo/api-generator';

initApiGenerator({
  onSuccess: (message: string) => Toast.success(message),
  dataPropertyName: 'data',
});

```