返回
React
React是用于构建用户界面的JavaScript框架。官网:https://reactjs.org
@sword6月7日
由同事推荐,最近开始上手使用UmiJS写项目,发现真不错,路由,状态管理,服务端渲染,支持TS,全都帮你整整齐齐弄好了,上来就可以直接干业务代码,巨方便~爱了爱了
https://umijs.org/zh-CN
点赞
1
转发
收藏
@sword1月19日编辑于1月19日
useState是一个帮助组件保存本地状态的hook,使用useState hook更新state,这里有两种不同的方式。

让我们来计算一下按钮的点击次数,
const [clicks, setClicks] = useState(0);
初始计数为0

1、更换state
每次点击按钮,你可以简单计算+1,

const handleClick = () => {
setClicks(clicks + 1);
};

例子:https://codesandbox.io/s/react-memo-in-action-qc65m?from-embed

如果你的更新是同步的并只在一个地方,这种更新方式会工作的很好。
但是如果点击值在不同位置异步更改,这样你的点击值容易是旧的state,这会使你的计数出错。
为了避开旧的state,你可能总是要获取上一个state并替换它。

2、更改先前的状态值

const handleClick = () => {
setClicks(prevCount => prevCount + 1);
};

例子:https://codesandbox.io/s/setstate-using-previous-value-vuyph?from-embed

这种方式,你可以总是获取最近的state值,并基于它计算一下state。

--------------------------------

译文来源于:https://jsmates.com/blog/different-ways-to-update-use-state-hooks
点赞
2/4
转发
收藏
@sword1月16日编辑于1月18日
在写函数组件时,有时我们需要在组件内使用一些变量,希望保存它并保持更新,但又想它不去触发组件渲染时,我们可以使用useRef,来保存变量。
1
1/5
转发
收藏