React框架自我整理和精简(二)

    一、React中的元素组成
(1)可以是Dom元素 (2)可以是用户自定义的组件
function组件和class组件的对应区别和相应的特点。
   class组件继承了React中的生命周期等特点。不同的生命周期可以编写不同的方式进行渲染值
和加载函数。
           二、提取组件的问题
(1)从命名做起
    如果随意的编写和和命名组件的话,那么相应的结构,就会非常的凌乱。因此需要组件
需要考虑易读性,和相应的通用性。 这就需要从组件的命名开始做起。
    如果要编写通用的组件,那就需要对组件进行拆解,将相应的特点和相应的值关联
起来。
(2)纯函数的概念
    很多架构里面都会说:函数是一等公民。一等公民的函数,强调的就是纯函数。
    纯函数就是说,函数的输出值只与传入函数的参数有关,不会因为除了传参之外的外部
参数改变函数的返回值。
    优点就是减少了出现问题或者测试的时候,所需要考虑的情况。设计用例的时候,
只需要考虑传参的值,来设计用例。这对于编码量级比较大的时候,是非常重要的。
    二、React中的class函数中的state和生命周期函数的来源
(1)函数组件中的生命周期钩子函数的来源
  函数组件对比class组件的差别,就在于class组件继承了React.Componet类,这个类
里面有相关生命周期的钩子函数的方法.
(2)state的概念和相关作用,以及实现更新的内部机制
    state和props类似,但是state是私有的,完全受控于当前组件。setstate之后创建得
值会和原来得state值合并,并完成相同值类型的修改。在部分情况下,多个setstate可能
会合并执行。
(3)常用的生命周期函数,又成钩子函数
    钩子函数是指,可以被系统捕捉,并处理后返回对应值,生效的函数。
        三、React中的常用生命周期函数
(1)ComponentDidMount()组件相应的第一次渲染到DOM中的时候,这时候的状态是
挂载(mount)
(2)ComponentWillUnMount()组件在被删除的时候,称为挂载(Unmount)。在
挂载之前可以执行相应的方法,比如清理定时函数。
    四、React中的值传递特点
(1)父组件和子组件无法知道某个组件的相应的状态,也不知道对方是函数组件还是class
组件。这就是state封装在单个组件的原因。 作为父组件可以存入多个状态,其它子
组件可以从直接父组件中的state中取出其它组件传入或者保存的状态值。
(2)这对于嵌套层数较多或者需、要通过子组件的内部某个孙子组件的变化更改父组件
的时候,就是一个问题。这个问题在reduce中得到了解决。但是React也有自己独有的
处理这种情况的方式。

shouldComponentUpdate


 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值