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形式创建组件。

  • 相关阅读:
    解题:AHOI 2005 航线规划
    解题:SCOI 2008 天平
    解题:SCOI 2014 方伯伯运椰子
    解题:APIO 2008 免费道路
    解题:USACO15JAN Grass Cownoisseur
    669. 换硬币(dp动态规划)
    8. 旋转字符串
    147. 水仙花数
    1131. 排列中的函数
    78. 最长公共前缀
  • 原文地址:https://www.cnblogs.com/jianxian/p/12509678.html
Copyright © 2011-2022 走看看