Введение

Самое простое решение для 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.