Введение
Самое простое решение для Redux, напишите Redux как React.
Функции
- Самый простой Redux - тот же синтаксис, что и у компонента React.
- Всего 2 API -
setStore()
иwithStore()
. - Асинхронные модели - Полная поддержка разделения кода для моделей.
- Автозагрузка - состояние автоматической загрузки для асинхронных действий.
GitHub
Https://github.com/nanxiaobei/retalk
Установить
Пряжа
yarn add retalk
npm
npm install retalk
использование
1. Модель
class CounterModel { state = { count: 0, }; add() { const { count } = this.state; this.setState({ count: count + 1 }); } async addLater() { await new Promise((resolve) => setTimeout(resolve, 1000)); this.add(); } }
2. Магазин
import { setStore } from 'retalk'; const store = setStore({ counter: CounterModel, });
3. Просмотр
import React from 'react'; import { withStore } from 'retalk'; const Counter = ({ count, add, addLater }) => ( <div> <p>{count}</p> <button onClick={add}>+</button> <button onClick={addLater}>+ ⏳{addLater.loading && '...'}</button> </div> ); const CounterWrapper = withStore({ counter: ['count', 'add', 'addLater'], })(Counter);
Что ж, всего 3 шага, простая демонстрация Retalk здесь. Https://codesandbox.io/s/5l9mqnzvx
Документация
Подробнее см. Документация GitHub README.