react函数组件

2023-11-14

react 创建组件有三种方式

  1. 函数式定义的无状态组件
  2. es5原生方式React.createClass定义的组件
  3. es6形式的extends React.Component定义的组件

这篇我们主要讲函数组件的使用,

在函数组件里面是没有生命周期管理和状态管理,但是有类似生命周期的一些方法在官网上叫做Hook

Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。

定义变量的话在函数组件里面一般这样

const [page, setPage] = React.useState(1);

在前面数组里面page就是我们定义的变量,后面setPage是用来改变page的值,后面小括号里面直接就代表了数据类型为number数值是1

类组件里面的shouldComponentUpdate优化,在函数组件里面可以使用React.memo来优化。

React.useEffect可以模拟生命周期比如

React.useEffect(() => {
   
  }, []);

这样就类似于componentDidMount ,一般都是用来发起请求

如果在第二个参数是空数组如论怎么改变就只会执行一次

如果在里面写变量了

React.useEffect(() => {
    
  }, [status, title, size, page])

这四个变量只要有一个改变,就会再次执行

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

react函数组件 的相关文章

随机推荐

  • 【满分】【华为OD机试真题2023 JS】简单的自动曝光

    华为OD机试真题 2023年度机试题库全覆盖 刷题指南点这里 简单的自动曝光 时间限制 1s 空间限制 256MB 限定语言 不限 题目描述 一个图像有n个像素点 存储在一个长度为n的数组img里 每个像素点的取值范围 0 255 的正整数
  • 使用OpenCV库实现的模板轮廓匹配定位功能块

    c include
  • 批处理替换修改文件名

    echo off echo echo title 批量替换文件名中的部分字符串 color 3f echo Note echo 本批处理可批量替换本文件所在文件夹下的所有文件名的相同字符 echo echo echo echo echo e
  • CentOS 8 通过二进制安装 MySQL

    需求 CentOS8下采用二进制安装包的形式安装MySQL 并且指定数据库文件存放的路径地址 步骤如下 在 MySQL下载地址 中下载 MySQL 二进制安装包 注意 在版本选择的时候 版本号在8 0 11及以下包后缀都是 tar gz 但
  • Python中from from __future__ import *的用法

    from future import 参考 https blog csdn net zzc15806 article details 81133045 我们在读代码的时候 总是会看到代码开头会加上from future import 这样的
  • NoClassDefFoundError/ClassNotFoundException 到底从哪引用到了这个类?排查思路

    1 背景 公司内网登录改造升级 使用方需要配合升级 jar 包 本以为很简单的事情 升级版本上线就 OK 了 没想到升级头一个服务 部署到测试环境就有问题 2 表象 访问所有页面报 404 3 排查思路 3 1 排除法 确定是不是升级 ja
  • cmd简单游戏代码_制作一个猜数字的游戏

    十一节假日 我在敲代码 外甥女突然问我 舅舅 你能不能给我编个游戏啊 看着外甥女期盼的眼神 我当然不好拒绝啊 而且如果写一点代码 能让小朋友对编程有个简单的了解 甚至激发她对编程学习的兴趣 那也是极好的啊 话不多说 我立马敲一个猜数字的文字
  • api-ms-win-core-path-l1-1-0.dll丢失怎么解决?

    api ms win core path l1 1 0 dll文件可以帮助用户快速的启动一些相关的应用程序 让应用程序可以正常的使用 但是近期有用户在电脑的使用中 遇到了系统提示提示 api ms win core path l1 1 0
  • Mysql的分布式(XA)真面目

    Mysql XA 一 XA是什么 二 MySQL中XA实现 1 内部XA事务 两阶段提交PC 2 外部XA事务 总结 一 XA是什么 XA 协议本就是为一个分布式事务协议 它规定了 XA PREPARE XA COMMIT XA ROLLB
  • [React] markdown以及markdown-navbar实现方案

    React markdown以及markdown navbar实现方案 1 前言 心血来潮 想在自己的项目中实现 Markdown 文件的渲染 以下是我当前的实现方式以及遇到的一些问题的记录 本人水平很拉 有更好的方法欢迎在下面讨论 2 m
  • C++ Primer阅读笔记--万能引用和引用折叠

    目录 1 万能引用 1 1 万能引用的实现 1 2 万能引用与右值引用的区别 2 引用折叠 1 万能引用 1 1 万能引用的实现 万能引用可以向其传递任何类型的参数 其会自动进行参数类型的推断 万能引用的两种实现如下 基于模板实现 temp
  • 【Ribbon路由规则器】服务筛选,过滤服务基础组件AbstractServerPredicate

    前言 Ribbon在进行Server过滤的时候 用到了一个重要的基础组件 AbstractServerPredicate 它的作用就是在众多Server的列表中通过一定的过滤策略踢除不合格的Server 留下来合格的Server列表 负载均
  • Matlab中值滤波

    medfilt2 是 MATLAB 中的一个函数 用于对二维图像进行中值滤波 中值滤波是一种非线性滤波方法 它将每个像素的值替换为该像素周围邻域内像素的中值 该函数语法如下 B medfilt2 A m n padopt 其中 A 是需要进
  • 三菱指令大全

    一 顺控指令 1 触点指令 00 LD 逻辑操作开始 01 LDI 逻辑非操作开始 02 AND 逻辑乘 03 ANI 逻辑乘非 04 OR 逻辑加 05 ORI 逻辑加非 2 连接指令 06 ANB AND逻辑块与 07 ORB OR逻辑
  • 嵌入式数据库Sqlite3.3.6移植教程

    本文介绍的内容都是基于Fedora10平台的 一 PC机编译安装 请阅读在安装包里的 INSTALL 文件 或者使用PEAR installer with pear install sqlite SQLite已经内置了 你不需要安装任何附加
  • 字符串数组中,strlen与sizeof的比较

    char str1 15 hello 用 赋值系统会在字符串结尾自动添 0 printf strlen str1 ld n strlen str1 printf sizeof str1 ld n sizeof str1 gt gt gt s
  • Ubuntu下,dpkg安装出错的修复

    参考 http www khattam info 2009 08 04 solved subprocess pre removal script returned error exit status 2 error 我在ubuntu上安装l
  • 【数学建模集训系列】公交查询系统的matlab实现-公交站点和线路对应矩阵

    功能 求站点S和路线L矩阵 表示通过S的所有线路 日期 8 9 2011 clear clc fid fopen Bus txt r 打开数据 if fid gt 0 disp 数据文件打开成功 else disp 打开失败 return
  • 【目标检测】yolov5模型详解

    文章目录 一 Yolov5网络结构 1 1 Input 1 2 Backbone 1 2 1 Conv模块 1 2 2 C3模块 1 2 3 SPPF模块 1 3 Neck 1 4 Head 1 4 1 head 1 4 2 目标框回归 1
  • react函数组件

    react 创建组件有三种方式 函数式定义的无状态组件 es5原生方式React createClass定义的组件 es6形式的extends React Component定义的组件 这篇我们主要讲函数组件的使用 在函数组件里面是没有生命