# @mpfe/cskit

> 🐱‍🏍🐱‍🏍🐱‍🏍

Latest version **0.5.0** (published 2019-10-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install @mpfe/cskit
pnpm add @mpfe/cskit
yarn add @mpfe/cskit
bun add @mpfe/cskit
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.0 |
| Published | 2019-10-23 |
| First published | 2019-09-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 49.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | ktlshy, mvslan |

## Links

- npm: https://www.npmjs.com/package/@mpfe/cskit
- npm.io page: https://npm.io/package/@mpfe/cskit

## Dependencies (6)

- [react](https://npm.io/package/react.md) ^16.8.6
- [lodash](https://npm.io/package/lodash.md) ^4.17.15
- [warning](https://npm.io/package/warning.md) ^4.0.3
- [redux-saga](https://npm.io/package/redux-saga.md) ^1.0.5
- [react-redux](https://npm.io/package/react-redux.md) ^7.1.0
- [@types/lodash](https://npm.io/package/@types/lodash.md) ^4.14.144

## Recent versions

- 0.5.0 (latest) — 2019-10-23
- 0.4.0 — 2019-10-22
- 0.3.0 — 2019-10-22
- 0.2.0 — 2019-09-03
- 0.1.0-alpha.0 — 2019-09-03

## README

## 内容系统开发套件

🐱‍🏍🐱‍🏍🐱‍🏍

###Install

```sh
 npm install  @mpfe/cskit
```

### 概念

dataProvider
一种可以给组件提供所需数据的方法，该方法返回一个 Promise，其 resolve 的参数为已经被过滤过的数据，使用这个函数的作用在于保持组件的相对干净，并提供统一的数据格式

```javascript
export default (httpClient: any) => {
  return (type: string) => {
    switch (type) {
      case "QUERY_ONE_BY_ID":
        return (resource: string) => {
          return new Promise((resolve, reject) => {
            httpClient
              .get(`/api/queryArchivesById/${resource}`)
              .then((res: any) => {
                resolve(res.data.data);
              })
              .catch((err: any) => reject(err));
          });
        };
      case "QUERY_ONE_BY_NO":
        return (resource: string) => {
          return new Promise((resolve, reject) => {
            httpClient
              .get(`/api/queryArchivesByNo/${resource}`)
              .then((res: any) => {
                resolve(res.data.data);
              })
              .catch((err: any) => reject(err));
          });
        };

      default:
        return Promise.resolve();
    }
  };
};
```

###Usage

`cskit`需要和 👽[map](https://www.npmjs.com/package/@mpfe/mpa) 配合使用

####`topRoutes` 🛴🛴(完善中)
获取路由

```javascript
// ... init mpa
import { topRoutes } from "@mpfe/cskit";

app.useModel(topRoutes({ dataProvider }));

//它通过dataProvide 获取到的数据格式为 
{
 records:array;
 routesMap:object 
 }
```

####`normalList`
获取列表
🐍 注意：列表数据多数情况下可能需要放在 redux store 中维护，因此在使用`QueryList`时，请确保已经注册了对应`namespace`的`model`

```javascript
import { normalList, QueryList } from "@mpfe/cskit";

//注册model
app.useModel(
  normalList({
    namespcae: "news",
    dataProvide
  })
);
```

#### 高阶组件

- QueryList

QueryList 需要和 mpa 结合使用，将数据放在 store 中

```jsx

<QueryList namespace="news">
  {listData => <YourComponent {...listData} />}
</QueryList>;

```
- SQueryList
```jsx
<SQueryList options={}>
   {props=><YourComponent></YourComponent>}
</SQueryList>
```




- QueryOne
  查询单条信息

---
_Source: https://npm.io/package/@mpfe/cskit · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._