假设我们有一个包含 usestate 的 react 组件。
const expensivecalculation = () => {
// ...
}
export default function aboutpage() {
const [state, setstate] = usestate(expensivecalculation())
return (
// ...
);
}
我们用昂贵的计算函数的结果启动状态。
每次组件重新渲染时，函数 costlycalculation 都会运行，即使我们只需要它的结果作为 usestate 的初始值。该函数的结果将不会被使用。
为了避免重新渲染期间昂贵的计算，请传递函数本身而不调用它。 react 足够智能，可以在挂载时调用函数本身，而不是每次渲染时调用函数本身。
宽维企业网站管理系统功能说明宽维系列网站管理系统全面免费，个人和商业应用均免费。宽维企业网站管理系统是基于Php＋MySql技术开发的企业电子商务平台，全后台操作，无需学习网页制作等知识。前台智能生成页面，可以方便地在线管理、维护、更新您的企业网站。宽维企业网站管理系统安装简单快捷，5分钟就可以安装完成。1 栏目管理方便灵活：可以发布和管理您需要的任何内容的个性栏目。内置数十个功能发布模型，并可以
0
const expensiveCalculation = () => {
// ...
}
export default function AboutPage() {
const [state, setState] = useState(expensiveCalculation)
return (
// ...
);
}
以上就是您可能不知道的 useState 性能技巧的详细内容，更多请关注php中文网其它相关文章！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
694
收藏
