render()

当 被调用时,它会检查 和 的变化并返回以下类型之一:

    • React 元素。通常通过 JSX 创建。例如,<div /> 会被 React 渲染为 DOM 节点,<MyComponent /> 会被 React 渲染为自定义组件,无论是 <div /> 还是 <MyComponent /> 均为 React 元素。
    • 数组或 fragments。 使得 render 方法可以返回多个元素。欲了解更多详细信息,请参阅 fragments 文档。
    • Portals。可以渲染子节点到不同的 DOM 子树中。欲了解更多详细信息,请参阅有关 字符串或数值类型。它们在 DOM 中会被渲染为文本节点
  • 布尔类型或null。什么都不渲染。(主要用于支持返回 test && <Child /> 的模式,其中 test 为布尔类型。)

render() 函数应该为纯函数,这意味着在不修改组件 state 的情况下,每次调用时都返回相同的结果,并且它不会直接与浏览器交互。

如需与浏览器进行交互,请在 componentDidMount() 或其他生命周期方法中执行你的操作。保持 render() 为纯函数,可以使组件更容易思考。

https://zh-hans.reactjs.org/docs/react-component.html#render

组件的本质为构建UI单元;

无状态组件可以简化为一个函数;

(){

return< ="">

< />

</>

;

render()--组件--纯函数的更多相关文章

  1. react第八单元(什么是纯函数-组件的性能优化-pureComponent-组件性能优化的原理)

    课程目标 理解纯函数 熟练掌握组件性能优化的几种技巧 pureComponent和Component的区别 #知识点 一个函数的返回结果只依赖于它的参数,并且在执行过程里面没有副作用,我们就把这个函数 ...

  2. js函数式编程(一)-纯函数

    我将写的第一个主题是js的函数式编程,这一系列都是mostly adequate guide这本书的读书总结.原书在gitbook上,有中文版.由于原作者性格活泼,书中夹杂很多俚语,并且行文洒脱.中文 ...

  3. JavaScript使用纯函数避免bug

    纯函数 一.纯函数 定义:纯函数是指不依赖并且不修改其作用域之外的函数.通过以下几个示例来认识纯函数: var a = 10; //纯函数 function foo(num){ return num ...

  4. JAVA+PHP+阿里云组件纯手工实现POP、SMTP、IMAP开发邮件服务器(二)

    java开发邮件服务器的接收模块 用java建立socket服务端,监听端口25,实现SMTP协议.即可完成邮件服务器的接收模块. 这里要注意的是,SMTP协议其实可以分为两种.一种是你用手机.PC等 ...

  5. Function Programming - 纯函数(Pure Function)

    纯函数的定义,非常重要!! Pure function 意指相同的输入,永远会得到相同的输出,而且没有任何显著的副作用. 老样子,我们还是从最简单的栗子开始: var minimum = 21; va ...

  6. C#中的函数式编程:递归与纯函数(二)

    在序言中,我们提到函数式编程的两大特征:无副作用.函数是第一公民.现在,我们先来深入第一个特征:无副作用. 无副作用是通过引用透明(Referential transparency)来定义的.如果一个 ...

  7. [UE4]纯函数的执行时机

    一.纯函数是在需要的时候被调用 二.纯函数内不应当修改任何数据 三.如果同一个函数需要多个得到多个纯函数的返回值,则多个纯函数的调用顺序不是固定的,并且一个纯函数的调用顺序也不应当影响下一个纯函数的返 ...

  8. [UE4]有限状态机、动画状态机、纯函数

    有限状态机 FSM:Finite State Machine,表示有限个状态以及在这些状态之间转移和动作的数学模型 纯函数: 纯函数: 先后调用顺序不重要,没有修改任何数值,只是获取数值或者临时计算一 ...

  9. render组件

    [render组件] Render继承于Component. It contians general functionality for all renderers. A renderer is wh ...

随机推荐

  1. Elasticsearch Transport 模块创建及启动分析

    Elasticsearch 通信模块的分析从宏观上介绍了ES Transport模块总体功能,于是就很好奇ElasticSearch是怎么把服务启动起来,以接收Client发送过来的Index索引操作 ...

  2. windows版mysql安装

    https://blog.csdn.net/ycxzuoxin/article/details/80908447

  3. python之路——阅读目录

    阅读目录 希望大家多多交流,有错误的地方请随时指正,笔记记得可能有点杂 一.python入门 计算机基础 编程语言发展史和python安装  二.数据类型.字符编码.文件处理 python基础数据类型 ...

  4. Linux下c语言TCP多线程聊天室

    开发环境:Linux,GCC 相关知识:TCP(博客:传送门),线程 附加:项目可能还有写不足之处,有些bug没调出来(如:对在线人数的控制),希望大佬赐教. 那么话不多说,放码过来: 码云:传送门, ...

  5. tornado利用装饰器记录每个http请求

    python利用装饰器记录每个http请求 设置装饰器 from functools import wraps from datetime import datetime ""&q ...

  6. Java学习:集合的使用与数组的区别

    ArrayList 集合 ArrayList 集合 ArrayList<String> list = new ArrayList<>(); 对于ArrayList来说,有一个尖 ...

  7. 《MySQL实战45讲》学习笔记2——MySQL的日志系统

    一.日志类型 逻辑日志:存储了逻辑SQL修改语句 物理日志:存储了数据被修改的值 二.binlog 1.定义 binlog 是 MySQL 的逻辑日志,也叫二进制日志.归档日志,由 MySQL Ser ...

  8. NET Core 导入web.config配置文件

    1.首先需要在NET Core项目中引入System.Configuration.ConfigurationManager,它可以读取web.config中的相关配置信息. 2. 将web.confi ...

  9. C#写入Excel文件方式

    由于在工作中经常要把数据库的统计数据导入Excel文件,进行IO磁盘操作,所以在这里记录下. 首先创建默认文件夹,并返回文件夹路径. private static string CPath(strin ...

  10. Java自学-接口与继承 super

    Java的super关键字 步骤 1 : 准备一个显式提供无参构造方法的父类 准备显式提供无参构造方法的父类 在实例化Hero对象的时候,其构造方法会打印 "Hero的构造方法 " ...