duan-hooks-vue

1.0.1 • Public • Published

duan-hooks-vue

Experimental React hooks implementation in Vue3

install

yarn add duan-hooks-vue

React-style Hooks

import { useState, useReducer, useEffect, useLayoutEffect } from "duan-hooks-vue";

const FunctionalComponent = (props, context) => {
  const [count1, setCount1] = useState(0);
  const [count2, setCount2] = useReducer((x) => x + 1, 1);
  const [count3, setCount3] = useReducer((x) => x + 1, 2);

  useEffect(() => {
    console.log("useEffect", count2);
  }, [count2]);

  useLayoutEffect(() => {
    console.log("useLayoutEffect", count2);
  }, [count2]);

  return (
    <>
      <button onClick={() => setCount1(2)} {...props}>
        count1:{count1}
      </button>
      <button onClick={() => setCount2()} {...props}>
        count2:{count2}
      </button>
      <button onClick={() => setCount3()} {...props}>
        count3:{count3}
      </button>
    </>
  );
};

export default FunctionalComponent;

Package Sidebar

Install

npm i duan-hooks-vue

Weekly Downloads

1

Version

1.0.1

License

MIT

Unpacked Size

13.5 kB

Total Files

5

Last publish

Collaborators

  • hkduan2004