README.en.md

lazy-reducer

Dynamically load reducer.

Install

npm install --save-dev lazy-reducer

API

Setup

lazyReducerEnhancer

store enhancer

import { lazyReducerEnhancer } from 'lazy-reducer';

const rootReducerObj = {
    nameA: reducerA,
    nameB: reducerB
};
const store = createStore(combineReducers(rootReducerObj), {}, lazyReducerEnhancer(rootReducerObj));

Usage

<LazyReducer reducers/>

import { LazyReducer } from 'lazy-reducer';

<LazyReducer
    reducers={{
        nameA: someReducer1,
        nameB: someReducer2
    }}
>
    <AnyComponent />
</LazyReducer>

<LazyReducer
    reducers={done => {
        setTimeout(() => {
            done({
                nameA: someReducer1,
                nameB: someReducer2
            })
        }, 1000)
    }}
>
    <AnyComponent />
</LazyReducer>

withLazyReducer(reducers)

HOC Usage

import { withLazyReducer } from 'lazy-reducer'

class Comp extends Component {
    render() {
        <div>i am a Component wrapped by lazy reducer !</div>
    }
}

export default withLazyReducer({
    nameA: someReducer1,
    nameB: someReducer2
})(Comp)

export default withLazyReducer(done => {
    setTimeout(() => {
        done({
            nameA: someReducer1,
            nameB: someReducer2
        })
    }, 1000)
})(Comp)

@Decorator Usage

import { withLazyReducer } from 'lazy-reducer';

@withLazyReducer({
    nameA: someReducer1,
    nameB: someReducer2
})
class Comp extends Component {
    render() {
        <div>i am a Component wrapped by lazy reducer !</div>;
    }
}

@withLazyReducer(done => {
    setTimeout(() => {
        done({
            nameA: someReducer1,
            nameB: someReducer2
        })
    }, 1000)
})
class Comp extends Component {
    render() {
        <div>i am a Component wrapped by lazy reducer !</div>
    }
}

example

examples