Rxloop NPM | npm.io

rxLoop

rxLoop = Redux + redux-observable.

Predictable state container for JavaScript apps based on RxJS， like Redux with redux-observable middleware.

Using RxJS instead of Redux.
Easy study, only four apis: app.model、app.dispatch、app.getState、app.stream.
Cancel async actions easyly.

Installation

$ npm i rxloop

Hello rxloop

import { Observable } from 'rxjs';
import { mergeMap, map } from 'rxjs/operators';
import rxLoop from 'rxloop';

const counterModel = {
  name: 'counter',
  state: {
    counter: 0,
  },
  reducers: {
    increment(state) {
      return {
        ...state,
        counter: state.counter + 1
      };
    },
  },
  epics: {
    getData(action$) {
      return action$.pipe(
        mergeMap(() => {
          return Observable.fromPromise(
            // Promise
            api().catch((error) => {
              return { error };
            }),
          );
        }),
        map((data) => {
          return {
            type: 'increment',
          };
        }),
      );
    }
  }
};

const app = rxLoop();
app.model(counterModel);

app.stream('counter').subscribe((state) => {
  // this.setState(state);
});

// sync update
app.dispatch({
  type: 'counter/increment',
});

// async update
app.dispatch({
  type: 'counter/getData',
});