diox-react v1.0.1

diox-react

Official diox connector for React.

Installation

yarn add diox-react

Usage

// main.jsx
// --------------------------
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import Counter from './Counter.jsx';

ReactDOM.render(<Counter />, document.body);


// store.js
// --------------------------
import { Store } from 'diox';

const store = new Store();
store.register('my-module', {
  mutator: ({ state }, mutation) => {
    switch (mutation) {
      case 'INCREMENT':
        return {
          count: state.count + 1,
        };
      default:
        return { ...state || { count: 0 } };
    }
  },
});

export default store;


// Counter.jsx
// --------------------------
import * as React from 'react';
import connect from 'diox-react';
import store from './store.jsx';

const mapper = {
  'my-module': (newState) => ({ count: newState.count }),
};

export default connect(store, mapper)(({ mutate }) => class extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  doSomething() {
    mutate('my-module', 'INCREMENT');
  }

  render() {
    return <button type="button" onClick={this.doSomething}>{this.state.count}</button>;
  }
});

API documentation

You can find the full API documentation here

Contributing

See the Contribution guide

License

MIT

Copyright (c) Matthieu Jabbour.