November Perfect Moustache

    use-class-hooks

    0.2.4 • Public • Published

    use-class-hooks

    Use react hooks in classes in React v16.5+

    ⚠️ WARNING: This is an experiment. Do not ship production code with this module!

    Demos

    Install

    npm install --save use-class-hooks
    # or 
    yarn add use-class-hooks

    Usage

    import React from "react";
    import "use-class-hooks";
     
    class Example extends React.Component {
      render() {
        const [count, setCount] = this.useState(0);
        return (
          <div>
            Count: {count}
            <button onClick={() => setCount(old => old + 1)}>Increment</button>
          </div>
        );
      }
    }

    Documentation

    The following hooks are available on the class instance and follow the official React Hooks API here: https://reactjs.org/docs/hooks-reference.html

    • this.useReducer
    • this.useState
    • this.useContext
    • this.usePrevious
    • this.useMemo
    • this.useCallback
    • this.useEffect
    • this.useRef

    The following hooks are not yet available. Feel free to submit a PR!

    • this.useImperativeMethods
    • this.useMutationEffect
    • this.useLayoutEffect

    Custom Hooks

    You can use a custom hook via the this.useHook hook:

    // Custom Hook
    function useTodos(a, b, c) {
      const [todos, setTodos] = this.useState([]);
      return [
        todos,
        {
          addTodo: todo => setTodos(old => [...old, todo])
        }
      ];
    }
     
    // Usage
    class MyComponent extends React.Component {
      render() {
        const [todos, { addTodo }] = this.useHook(useTodos, a, b, c);
      }
    }

    Custom Hooks function are executed with the this context of the class instance, so you have access to all of the built in react hooks. Also, any parameters passed after the hook function are forwarded to your custom hook.

    License

    MIT © tannerlinsley

    Keywords

    none

    Install

    npm i use-class-hooks

    DownloadsWeekly Downloads

    6

    Version

    0.2.4

    License

    MIT

    Unpacked Size

    46.4 kB

    Total Files

    10

    Last publish

    Collaborators

    • tannerlinsley