zoukankan      html  css  js  c++  java
  • 浅谈react无状态组件(哑组件)和有状态组件(智能组件)的区别

    (1)无状态组件

      无状态组件(Stateless Component)是最基础的组件形式,由于没有状态的影响所以就是纯静态展示的作用。一般来说,各种UI库里也是最开始会开发的组件类别。如按钮、标签、输入框等。它的基本组成结构就是属性(props)加上一个渲染函数(render)。由于不涉及到状态的更新,所以这种组件的复用性也最强。

    (2)有状态组件

      在无状态组件的基础上,如果组件内部包含状态(state)且状态随着事件或者外部的消息而发生改变的时候,这就构成了有状态组件(Stateful Component)。有状态组件通常会带有生命周期(lifecycle),用以在不同的时刻触发状态的更新。这种组件也是通常在写业务逻辑中最经常使用到的,根据不同的业务场景组件的状态数量以及生命周期机制也不尽相同。

    (3)对比

      在React中,我们通常通过props和state来处理两种类型的数据。props是只读的,只能由父组件设置。state在组件内定义,在组件的生命周期中可以更改。基本上,无状态组件(也称为哑组件)使用props来存储数据,而有状态组件(也称为智能组件)使用state来存储数据。

    (4)选取

    总的来说:无状态函数式写法 优于React.createClass,而React.Component优于React.createClass。能用React.Component创建的组件的就尽量不用React.createClass形式创建组件。

  • 相关阅读:
    metasploit生成payload的格式
    Win10专业版激活
    用Python对html进行编码
    ubuntu服务器搭建DVWA站点
    brew安装和换源
    生命中的最后一天【转】
    基础博弈
    jQuery-4.动画篇---jQuery核心
    jQuery-4.动画篇---自定义动画
    jQuery-4.动画篇---动画切换的比较(toggle与slideToggle以及fadeToggle的比较)
  • 原文地址:https://www.cnblogs.com/jianxian/p/12509678.html
Copyright © 2011-2022 走看看