Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-use-state-with-callback

y805939188285ISC1.0.2TypeScript support: included

use state with callback in hooks

react hooks, react-use, react-use-state, react-use-state-with-callback, react-use-callback, react-use-state-callback, use-state-with-callback, state callback, use callback, use hooks with callback

readme

带有 callback 的 useState


使用方式

  npm install --save react-use-state-with-callback
import React from 'react';
import ReactDOM from 'react-dom';
import useStateWithCallback from 'react-use-state-with-callback';
import './index.css';

const Test: React.FC<any> = (props) => {
  const [number1, setNumber1] = useStateWithCallback(0);
  const [number2, setNumber2] = useStateWithCallback(99);
  const handleClick1 = () => setNumber1(number1 + 1, (prevState, currentState) => {
    console.log('callback effect 111', `currentState: ${currentState}`, `prevState: ${prevState}`);
  });
  const handleClick2 = () => setNumber2(number2 - 1, (prevState, currentState) => {
    console.log('callback effect 222', `currentState: ${currentState}`, `prevState: ${prevState}`);
  });
  return (
    <>
      <button onClick={handleClick1}>{number1}</button>
      <button onClick={handleClick2}>{number2}</button>
    </>
  )
}