1.0.1 • Published 5 years ago

react-redux-mapper v1.0.1

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

React-redux Action & State mapper

React-redux Action & State mapper is a lightweight lib for mapping state and actions for a component with ease. WARNING! I've developed this for my own project and it serves me well so far. Report any bugs you find please!

INSTALLING

npm i react-redux-mapper

HOW TO USE:

ACTION MAPPING:

    import React from "react";
    import { connect } from "react-redux";
    import { actionMapper } from "react-redux-mapper";
    import * as actions from "path_to_action_factory";
    /* 
    Here we assume that imported action factory is an object with the following structure:
    {
	actionName: func(),
	actionName2: func(),
	...etc
    }
    */

    const mapToAction = actionMapper(actions); // Will make available all the actions from imported actions
    const mapToAction = actionMapper(actions, [actionNames]); // Will make available only the specified keys
	
    class SomeComponent extends React.Component {
	/*CLASS BODY*/
    }

    const Comp = connect(null, mapToAction)(SomeComponent);
    export default Comp;

STATE MAPPING

    import React from "react";
    import { connect } from "react-redux";
    import { stateMapper } from "react-redux-mapper";
    import * as actions from "path_to_action_factory";
	
    const mapState = stateMapper(); // Maps entire state with all available keys
    const mapState = stateMapper(arrayOfKeysToMap); // Maps only specified keys
    const mapState = stateMapper('keyName', getter?); // Maps only one key, with specific getter if passed, all getters have the same syntax - see bellow;
    const mapState = stateMapper({
	stateKey: null,
	stateKey: 'nameForProp',
	stateKey: {
		name?: newNameForProp,
		getter?: getter(val, state) => {}
	}
    });  
	
    // EVERY GETTER IS A FUNCTION THAT RECIEVES 2 ARGUMENTS - value of a state with current key and entire state, and must return a value:
    // getter: (value, state) => value * 10
	
    class SomeComponent extends React.Component {
    /*CLASS BODY*/
    }

    const Comp = connect(mapState)(SomeComponent);
    export default Comp;
1.0.1

5 years ago

1.0.0

5 years ago