pri-plugin-rematch ·

rematch is a nice framework for redux.

We provide pri-plugin-rematch to use it more easy!

Usage

npm i pri-plugin-rematch

.
├── src
│    └── models
│          ├── application.ts      # model file
│          └── user.ts             # model file
└── priconfig.json

Let’s try it! For example, create a model named user:

src/models/user.ts

import { model } from 'pri/model';

export default model({
  state: {
    name: 'jeck',
    age: 25
  },
  reducers: {
    increment: (state, count = 1) => {
      return {
        ...state,
        age: state.age + count
      };
    }
  },
  effects: {
    async asyncIncrement() {
      await new Promise(resolve => {
        setTimeout(resolve, 1000);
      });
      this.increment(5);
    }
  }
});

Then, use it in pages!

src/pages/index.tsx

import { connect } from 'pri/models';

@connect(
  state => {
    return {
      age: state.user.age
    };
  },
  dispatch => {
    return { increment: dispatch.user.increment, asyncIncrement: dispatch.user.asyncIncrement };
  }
)
export default class Page extends React.PureComponent<Props, State> {
  /**/
}

Import connect from 'pri/models' is a better way, 'pri/models' provides a strong typed connect function: