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. web-debug-server

    web-debug-server 项目来自:https://github.com/itzg/web-debug-server 这位大哥的镜像做的很有意思:一个很小的web debug服务器,访问它可以 ...

  2. ubuntu更改源为aliyun的源;ROS改为新加坡源

    在修改source.list前,最好先备份一份 sudo cp /etc/apt/sources.list /etc/apt/sources.list.old 执行命令打开source.list文件 ...

  3. CLH lock 原理及JAVA实现

    --喜欢记得关注我哟[shoshana]--​ 前记 JUC中的Lock中最核心的类AQS,其中AQS使用到了CLH队列的变种,故来研究一下CLH队列的原理及JAVA实现 一. CLH背景知识 SMP ...

  4. day61——多表操作(增、删除、改、基于对象的跨表查询)

    day61 增删改查 增加 # 增加 # 一对一 # au_obj = models.AuthorDetail.objects.get(id=4) models.Author.objects.crea ...

  5. 【3.1】学习C++之再逢const

    随着学习的深入,就会发现曾经学的const还有更深入的用法,现在就对const的未总结的用法进行总结. 本文就是针对const在类中的情况进行的总结. 有时我们会遇到下面这种将类的成员变量用const ...

  6. Go的运算符

    1 算术运算符 运算符 术语 示例 结果 + 加 10 + 5 15 - 减 10 - 5 5 * 乘 10 * 5 50 / 除 10 / 5 2 % 取模(取余) 10 % 3 1 ++ 后自增, ...

  7. datax分析与思考(一)

    Datax 总体流程图 先看执行的第一个步骤: 在最上层抽象类,这个里面相当于获取全局公共信息,java入口部分就是这个Engine的main方法直接启动 Engine 启动 com.alibaba. ...

  8. Java之路---Day13

    2019-10-28-22:40:14 目录 1.Instanceof关键字 2.Final关键字 2.1Final关键字修饰类 2.2Final关键字修饰成员方法 2.3Final关键字修饰局部变量 ...

  9. 原生JS实现前端动画框架

    封装了一个JS方法,可支持块元素的常规动画:高.宽.透明度.位置等,同时支持链式动画和同时运动,参照imooc整理,具体代码如下: /** * 获取HTML元素属性值 * obj是Element, a ...

  10. EnumSet详细讲解

    https://blog.csdn.net/tugangkai/article/details/89631886 之前介绍的Set接口的实现类HashSet/TreeSet,它们内部都是用对应的Has ...