react中关于hook介绍及其使用(3)

2023-06-22 来源:飞速影视
在这里通过上面我们已经知道的就是count能够获取到值,那么其所对应的setCount(值),这种赋值的方式就是给count变量赋值的,然后通过count就能够获取到值。
为什么要采用这种方式呢?原因:是因为react中的单向数据源,这样的话,能够保证你的数据源流向会更加的清楚,这也是react所区别于vue中双向数据源绑定的一点hook中设置多个全局变量的方式
在hook中,如果我们需要去设置多个类似于上面所说的count,那么就需要多次使用useState这个hook,当然你也可以设置一个变量在hook的最外部,即在hook这个函数组件的外部。需要注意的是别在整个hook这个函数的全局设置,因此在hook的运行机制中,在每次加载时,都会从新去加载里面的变量,因此你是不能够去获取到在整个函数内部中使用该变量所改变的值的,能够获取到的就只是这个变量的初始值*
useEffect hook
对于useEffect hook,其用途类似于class组件中的生命周期函数,用来处理在一些特定时刻需要去做的事情,这种事情常被叫做副作用。在使用useEffect这个hook时,需要注意的一点就是其不能够被包含在循环,判断语句中,否则项目会出现报错,这也是hook的一种设置机制
副作用的划分:不需要清除的: 在React更新DOM之后运行一些额外的代码:如:发送网络请求,手动变更DOM,记录日志等需要清除的:当使用外部数据源时,需要去清除数据,如:定时器,需要我们在结束的时候去清除渲染时机:在使用useEffect这个hook时,需要注意的就是其渲染的时机,默认情况下会在第一次渲染和每一次更新时去执行。对于如何去控制这个渲染时机,在下面的一个部分会有详细的介绍作用:告诉组件在渲染之后执行某些操作useEffect放在组件内部调用的原因:可以在effect中直接访问state中的变量effect返回函数:effect可选的清除机制,每个effect都可以返回一个清除函数接收内容:一个包含命令式、并且可能有副作用代码的函数清除effect:实现方式,effect函数需要返回一个清除函数effect执行时机:
在浏览器完成布局和绘制之后,传给useEffect的函数会延迟调用,因此不应该在函数中执行足赛浏览器更新屏幕的操作。默认条件执行:会在每轮组件渲染完成后执行,因而一旦effect的依赖发生变化,他就会被重新创建。要改变其执行时机,需要给useEffect传递第二个参数,只有当第二个参数值发生改变才会重新创建订阅。如果要使用这个优化的方式,需要确保数组包含了所有外部作用域中会发发生变化,且在effect中使用的变量。如果只想运行一次effect,可以传递一个空数组作为第二个参数。对于useEffect的初步认识只需要了解上面的即可。接下来就来介绍一个官网的实例,来说明useEffect
相关影视
合作伙伴
本站仅为学习交流之用,所有视频和图片均来自互联网收集而来,版权归原创者所有,本网站只提供web页面服务,并不提供资源存储,也不参与录制、上传
若本站收录的节目无意侵犯了贵司版权,请发邮件(我们会在3个工作日内删除侵权内容,谢谢。)

www.fs94.org-飞速影视 粤ICP备74369512号