标签：状态 钩子 ReactJS React searchTerm useState props 组件
跟我一起学习 ReactJS | useState 钩子
大家好，今天我要写的是 React 中的 useState hook。
在 React 中，不允许改变 React props（这将在另一篇文章中讨论），因为它们只是将信息从父组件传递到子组件。
React state 有一个可变的数据结构，也称为 ** 有状态的值。**
这些已知的有状态值将在 React 组件中实例化为所谓的 ** 状态，** 也可以通过 props 传递给子组件。它也可以通过使用函数来修改状态来改变。
当状态发生突变时，具有状态的组件和所有子组件都将重新渲染。
props 和 state 是不同的概念 props 用于将信息从父级传递到组件层次结构，而 state 用于随时间更改信息。
例如：
假设我们有一个带有输入字段的 Search 组件，我们想在页面上显示输入：
常量搜索 = () => {
// searchTerm = 当前状态和 setSearchTerm = 更新这个状态的函数（状态更新函数）
1.) const [searchTerm, setSearchTerm] = 反应 .useState(' ');
常量句柄变化 = ( 事件 ) => {
2.) 设置搜索词（ 事件 。目标价值）
};
返回 （
3.) <input ID =“搜索” 类型 =“文本” 改变 ={handleChange} />
4.)
{搜索词}
);
};
首先，我们导入 useState 钩子。
- useState 方法将返回一个数组，其中包含两个条目（当前）状态（searchTerm）和一个更新状态的函数 （状态更新功能） (setSeachTerm)，我们还定义了一个初始值，在这种情况下是一个空字符串。
2. 定义更新状态的函数。
3.我们传递事件处理程序的输入字段
4. 这里我们调用searchTerm，在这种情况下用户输入将显示页面上的当前状态。
感谢您阅读我的文章。如果您有任何反馈，请告诉我。
~阿里夫
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明
本文链接：https://www.qanswer.top/23064/24020913
标签：状态,钩子,ReactJS,React,searchTerm,useState,props,组件 来源： https://www.cnblogs.com/amboke/p/16672526.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。