Experimental React hooks implementation in Vue3
更多详细介绍请阅读我的掘金文章《在 Vue3 中实现 React 原生 Hooks（useState、useEffect）进而深入理解 React Hooks 的本质原理》
yarn add vue-hooks-api
import { useState, useReducer, useEffect, useLayoutEffect } from "vue-hooks-api";
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;