# fiy

> 基于 React Hooks 的数据流方案

Latest version **0.1.0** (published 2019-04-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install fiy
pnpm add fiy
yarn add fiy
bun add fiy
```

## 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.1.0 |
| Published | 2019-04-24 |
| First published | 2019-04-23 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 12.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 397 |
| Maintainers | alvinhui |
| Keywords | hooks, state |

## Links

- npm: https://www.npmjs.com/package/fiy
- Repository: https://github.com/ice-lab/fiy
- Issues: https://github.com/ice-lab/fiy/issues
- npm.io page: https://npm.io/package/fiy

## Dependencies (1)

- [lodash.isfunction](https://npm.io/package/lodash.isfunction.md) ^3.0.9

## Alternatives

- [@reckona/mreact-store](https://npm.io/package/@reckona/mreact-store.md) — 976 weekly downloads
- [regular-state](https://npm.io/package/regular-state.md) — 410 weekly downloads
- [@pacote/flux-actions](https://npm.io/package/@pacote/flux-actions.md) — 65 weekly downloads
- [@pilotlab/lux-debug](https://npm.io/package/@pilotlab/lux-debug.md) — 39 weekly downloads
- [vue-persist-state](https://npm.io/package/vue-persist-state.md) — 19 weekly downloads

## Recent versions

- 0.1.0 (latest) — 2019-04-24
- 0.0.2 — 2019-04-24
- 0.0.1 — 2019-04-24
- 0.0.1-0 — 2019-04-24
- 0.0.0 — 2019-04-23

## README

# fiy

基于 React Hooks 的数据流方案。

## 如何使用

### 声明 Store

```javascript
// src/stores/materials.js
export default {
  dataSource: [],
  async refresh() {
    this.dataSourde = await fetch(/* api */);
  },
  add(project) {
    this.dataSourde = [].concat(this.dataSource).concat([project]) };
  },
  async action() {
    // ...
  },
  actionSync() {
    // ...
  },
};
```

### 注册 Store

```javascript
// src/stores/index.js
import materials from './materials';
import Fiy from 'fiy';

const fiy = new Fiy();
fiy.registerStore('materials', materials);

export default fiy;
```

### 在 View 中使用

```javascript
import React, { useEffect } from 'react';
import stores from '@src/stores';

const Material = () => {
  const materials = stores.useStore('materials');
  const {  dataSource } = materials;

  useEffect(() => {
    materials.refresh();
  }, []);

  return (
    <div>
      <h2>Material</h2>
      <div>
        {dataSource.map(({ name }) => name)}
      </div>
    </div>
  );
};

export default Material;
```

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