useActions ·

A ~200 Bytes react hook, inspired by redux-thunk, for your your application action binding.

Fits well with useReducer for state management. 🔌

Installation

npm install use-actions

Documentation

useActions(actions, dispatch)

actions

Object containing all actions in the Redux Thunk model.

dispatch

The dispatch action. Take a look at useReducer.

Examples

A classical example o usage:

• Actions

// actions/foo-bar.jsx
const ACTION_TYPE = 'ACTION_TYPE';

export default argument => dispatch => {
    // [...]
    dispatch({ type: ACTION_TYPE, payload: argument });
}

• Container

import React, { useReducer } from 'useActions';
import useActions from 'use-actions';
import * as actions from '../actions/foobar';
import reducer, { initialState } from '../reducers/foobar';

const FoobarContainer = () => {
    const [state, dispatch] = useReducer(reducer, initialState);
    const { dispatchBindedAction } = useActions(actions, dispatch);
    
    // Runs passing curried dispatch to the action
    return <button onClick={dispatchBindedAction}>Click me</button>;
};

License

React is MIT licensed.