JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 8
  • Score
    100M100P100Q47390F
  • License MIT

Use objects and composition for creating complex reducers which can be easily maintained.

Package Exports

  • red-redux-class

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (red-redux-class) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

red-redux-class

Project assumptions

  • Keep immutability
  • Allow deep object nesting
  • Favor composition in reducers
  • Easy apply to a single reducer or whole project

Install

npm install --save red-redux-class

Usage

Base whole project on ReduxClass

Replace redux "combineReducers" with "combineReduxClassReducers" in your reducers.js file.

import { combineReduxClassReducers } from 'red-redux-class'

import yourReducer from './yourReducer'

const rootReducer = combineReduxClassReducers({
  yourReducer: yourReducer,
})

export default rootReducer

Use for single reducer

In yourReducer.js file import only a wrapper

import { ReduxClassWrapper } from 'red-redux-class'

function yourReducer(state = {}, action) {
  ...
}

export default ReduxClassWrapper(yourReducer)

Extend your redux object

File: YourReduxClass.js

In your class file, extend the class with ReduxClass.

 import { ReduxClass } from 'red-redux-class'

 class YourReduxClass extends ReduxClass {
   constructor(initialState) {
     super(initialState)
   }

   setAppName(appName) {
     this.set('appName', appName)
   }

   getAppName() {
     return this.appName
   }
 }

 export default YourReduxClass

File: yourReducer.js

Use your YourReduxClass object as initial state for your reducer. For every change in state create new state using new().

import { ReduxClassWrapper } from 'red-redux-class'
import YourReduxClass from './YourReduxClass'

const initialState = new YourReduxClass({
  appName: 'App name',
})

function yourReducer(state = initialState, action) {
  ...
    const newState = state.new()
    newState.setAppName('My app')
    return newState
  ...
}

export default ReduxClassWrapper(yourReducer)

CHANGELOG

1.0.7

  • removed dependencies

1.0.6

  • update packages

1.0.5

  • added initHiddenProperty to easily add hidden properties
  • added toJSON method for array redux class