如何让react hooks的setState支持第二个回调函数传参
时间: 2023-07-21 14:07:11 浏览: 145
React Hooks 的 `setState` 不支持第二个回调函数传参,但你可以使用 `useEffect` 来模拟这个功能。
你可以在 `useEffect` 中监听状态的变化,然后在回调函数中执行你想要的操作。具体实现如下:
```jsx
import React, { useState, useEffect } from 'react';
function Example() {
const [count, setCount] = useState(0);
useEffect(() => {
// 监听 count 的变化
console.log('count has changed:', count);
// 执行你想要的操作,这里是 alert 当前 count 的值
alert(`count is ${count}`);
}, [count]);
function handleClick() {
// 在 setCount 的第二个参数中传入回调函数
setCount(count + 1, () => {
console.log('count has been updated:', count);
});
}
return (
<div>
<p>You clicked {count} times</p>
<button onClick={handleClick}>Click me</button>
</div>
);
}
export default Example;
```
在上面的例子中,我们使用 `useEffect` 监听 `count` 的变化,当 `count` 发生改变时,我们执行了一个回调函数,这个回调函数中打印了当前 `count` 的值。同时,在 `handleClick` 函数中,我们在 `setCount` 的第二个参数中传入了一个回调函数,这个回调函数在 `count` 更新之后被执行,打印了更新后的 `count` 值。
阅读全文