useStateProxy
This is a custom hook to mutate state in reactjs
const useStateProxy = (initialValues) => {
const [, setTime] = useState({});
return useMemo(() => {
return new Proxy(initialValues, {
set: (obj, prop, value) => {
obj[prop] = value;
setTime({});
return true;
},
});
}, []);
};
function App() {
const state = useStateProxy({ count: 0 });
return (
<div>
<h1>{state.count}</h1>
<button
onClick={() => {
state.count += 1;
}}
>
Click
</button>
</div>
);
}
// Render App
render(<App />);
jsx