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

  • 相关阅读:
    Matlab学习-(1)
    数据库事务是什么?
    Python解释器有哪些类型,有什么特点?
    Ajax向后台发送简单或复杂数据,后端获取数据的方法
    模态对话框被灰色阴影遮罩挡住的问题
    闭包
    Django——form表单
    Django中常用的正则表达式
    Django中装饰器的使用方法
    Django中自定义过滤器步骤
  • 原文地址:https://www.cnblogs.com/jianxian/p/12509678.html
Copyright © 2011-2022 走看看