Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

inferno-redux

7.4.6 • Public • Published

inferno-redux

Inferno Redux is a redux library for Inferno.

Inferno Redux passes context.store value to each component.

Install

npm install inferno-redux

Contents

  • Provider
  • connect

Usage

Usage of inferno-redux is similar to that of react-redux. Inspiration was taken from react-redux to provide Inferno with a similar API.

import { render } from 'inferno';
import { Router, Route, browserHistory } from 'inferno-router';
import { Provider } from 'inferno-redux';
import { createStore } from 'redux';
 
const store = createStore(function(state, action) {
  switch (action.type) {
    case 'CHANGE_NAME':    
      return {
        name: action.name
      };
    default:
      return {
        name: 'TOM'
      };
  }
})
 
class App extends Component {
    render() {
        return <div>
            { this.props.children }
        </div>;
    }
}
 
class BasicComponent1 extends Component {
    render() {
        const store = this.context.store;
        const state = store.getState();
 
        const onClick = e => {
            e.preventDefault();
            store.dispatch({
                type: 'CHANGE_NAME',
                name: 'Jerry'
            });
        };
 
        return (
            <div className="basic">
                <a id="dispatch" onClick={ onClick }>
                    <span>Hello { state.name || 'Tom' }</span>
                </a>
            </div>
        );
    }
}
 
class BasicComponent2 extends Component {
    render() {
        const store = this.context.store;
        const state = store.getState();
 
        return (
            <div className="basic2">
                { state.name === 'Jerry' ? 'You\'re a mouse!' : 'You\'re a cat!' }
            </div>
        );
    }
}
 
render((
    <Provider store={ store }>
        <Router history={ browserHistory } component={ App }>
            <Route path='/next' component={ BasicComponent2 } />
            <Route path='/' component={ BasicComponent1 } />
        </Router>
    </Provider>
), container);

Install

npm i inferno-redux

DownloadsWeekly Downloads

261

Version

7.4.6

License

MIT

Unpacked Size

186 kB

Total Files

26

Last publish

Collaborators

  • avatar
  • avatar
  • avatar
  • avatar
  • avatar