React 基础入门笔记

news2025/6/8 18:30:20

一、JSX语法规则


1. 定义虚拟DOM时,不要写引号

2.标签中混入JS表达式时要用 {}

(1).JS表达式与JS语句(代码)的区别

(2).使用案例

3.样式的类名指定不要用class,要用className

4.内联样式,要用style={{key: value}}的形式去写

5.只有一个根标签

6.标签必须闭合

7.标签首字母

(1).若小写字母开头,则将标签转为html中同名元素,若html中无该标签对应同名元素,则报错

(2).若大写字母开头,react就去渲染对应的组件,若组件没有定义,则报错

二、函数式组件

三、类式组件

1.类的相关总结

2.类式组件

四、 state总结

五、props总结 

1.props使用

(1)正常使用:作用在标签ReactDom.render(<Person name="jerry" sex="女" age=“18”/>,doucument.getElementById('test1'))

(2)批量传参:

let obj = { name:"jerry", sex:"女", age:“18”}

作用在标签ReactDom.render(<Person {...obj}/>,doucument.getElementById('test1'))

2.props限制

六、ref总结 

1.字符串形式的ref

2.回调形式的ref

 3. creatRef的使用

七、生命周期

1.图例

2.生命周期阶段

 ​​

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2404421.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

压测软件-Jmeter

1 下载和安装 1.1 检查运行环境 Jmeter需要运行在java环境&#xff08;JRE 或 JDK&#xff09;中 在window的"命令提示窗"查看安装的java版本: java -version 1.2 下载Jmeter 从Apache官网下载Jmeter安装包 1.3 解压和运行 解压后,进入bin文件夹,双击jmeter.bat即可…

NLP学习路线图(三十):微调策略

在自然语言处理领域,预训练语言模型(如BERT、GPT、T5)已成为基础设施。但如何让这些“通才”模型蜕变为特定任务的“专家”?微调策略正是关键所在。本文将深入剖析七种核心微调技术及其演进逻辑。 一、基础概念:为什么需要微调? 预训练模型在海量语料上学习了通用语言表…

leetcode刷题日记——1.组合总和

解答&#xff1a; class Solution { public:void dfs(vector<int>& candidates, int target, vector<vector<int>>& ans, vector<int>& combine, int idx) {if(idxcandidates.size()){//遍历完的边界return;}if(target0){//找完了能组成和…

关于单片机的基础知识(一)

成长路上不孤单&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a; 【14后&#x1f60a;///计算机爱好者&#x1f60a;///持续分享所学&#x1f60a;///如有需要欢迎收藏转发///&#x1f60a;】 今日分享关于单片机基础知识的相关内容&#xf…

Xilinx FPGA 重构Multiboot ICAPE2和ICAPE3使用

一、FPGA Multiboot 本文主要介绍基于IPROG命令的FPGA多版本重构&#xff0c;用ICAP原语实现在线多版本切换。需要了解MultiBoot Fallback点击链接。 如下图所示&#xff0c;ICAP原语可实现flash中n1各版本的动态切换&#xff0c;在工作过程中&#xff0c;可以通过IPROG命令切…

Redis专题-基础篇

题记 本文涵盖了Redis的各种数据结构和命令&#xff0c;Redis的各种常见Java客户端的应用和最佳实践 jedis案例github地址&#xff1a;https://github.com/whltaoin/fedis_java_demo SpringbootDataRedis案例github地址&#xff1a;https://github.com/whltaoin/springbootData…

springMVC-11 中文乱码处理

前言 本文介绍了springMVC中文乱码的解决方案&#xff0c;同时也贴出了本人遇到过的其他乱码情况&#xff0c;可以根据自身情况选择合适的解决方案。 其他-jdbc、前端、后端、jsp乱码的解决 Tomcat导致的乱码解决 自定义中文乱码过滤器 老方法&#xff0c;通过javaW…

【iOS安全】iPhone X iOS 16.7.11 (20H360) WinRa1n 越狱教程

前言 越狱iPhone之后&#xff0c;一定记得安装一下用于屏蔽更新的描述文件&#xff08;可使用爱思助手&#xff09; 因为即便关闭了自动更新&#xff0c;iPhone仍会在某些时候自动更新系统&#xff0c;导致越狱失效&#xff1b;更为严重的是&#xff0c;更新后的iOS版本可能是…

智能标志桩图像监测装置如何守护地下电缆安全

在现代城市基础设施建设中&#xff0c;大量电缆、管道被埋设于地下&#xff0c;这虽然美化了城市景观&#xff0c;却也带来了新的安全隐患。施工挖掘时的意外破坏、自然灾害的影响&#xff0c;都可能威胁这些"城市血管"的安全运行。 传统的地下设施标识方式往往只依…

【网站建设】网站 SEO 中 meta 信息修改全攻略 ✅

在做 SEO 优化时,除了前一篇提过的Title之外,meta 信息(通常指 <meta> 标签)也是最基础、最重要的内容之一,主要包括: <meta name="description"> <meta name="keywords"> 搜索引擎重点参考这些信息,决定你网页的展示效果与排名。…

计算机视觉处理----OpenCV(从摄像头采集视频、视频处理与视频录制)

一、采集视频 VideoCapture 用于从视频文件、摄像头或其他视频流设备中读取视频帧。它可以捕捉来自 多种源的视频。 cv2.VideoCapture() 打开摄像头或视频文件。 cap cv2.VideoCapture(0) # 0表示默认摄像头&#xff0c;1是第二个摄像头&#xff0c;传递视频文件路径也可以 …

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- 第一篇:MIPI CSI-2基础入门

第一篇&#xff1a;MIPI CSI-2基础入门 1. 为什么需要CSI-2&#xff1f; 痛点场景对比 &#xff08;用生活案例降低理解门槛&#xff09; 传统并行接口CSI-2接口30根线传输720P图像仅需5根线&#xff08;1对CLK4对DATA&#xff09;线距&#xff1e;5cm时出现重影线缆可长达1…

变幻莫测:CoreData 中 Transformable 类型面面俱到(一)

概述 各位似秃似不秃小码农们都知道&#xff0c;在苹果众多开发平台中 CoreData 无疑是那个最简洁、拥有“官方认证”且最具兼容性的数据库框架。使用它可以让我们非常方便的搭建出 App 所需要的持久存储体系。 不过&#xff0c;大家是否知道在 CoreData 中还存在一个 Transfo…

开源技术驱动下的上市公司财务主数据管理实践

开源技术驱动下的上市公司财务主数据管理实践 —— 以人造板制造业为例 引言&#xff1a;财务主数据的战略价值与行业挑战 在资本市场监管日益严格与企业数字化转型的双重驱动下&#xff0c;财务主数据已成为上市公司财务治理的核心基础设施。对于人造板制造业而言&#xff0…

Java建造者模式(Builder Pattern)详解与实践

一、引言 在软件开发中&#xff0c;我们经常会遇到需要创建复杂对象的场景。例如&#xff0c;构建一个包含多个可选参数的对象时&#xff0c;传统的构造函数或Setter方法可能导致代码臃肿、难以维护。此时&#xff0c;建造者模式&#xff08;Builder Pattern&#xff09;便成为…

win32相关(IAT HOOK)

IAT HOOK 什么是IAT Hook&#xff1f; IAT Hook&#xff08;Import Address Table Hook&#xff0c;导入地址表钩子&#xff09;是一种Windows平台下的API钩取技术&#xff0c;通过修改目标程序的导入地址表(IAT)来拦截和重定向API调用 在我们之前学习pe文件结构的导入表时&am…

零基础玩转物联网-串口转以太网模块如何快速实现与TCP服务器通信

目录 1 前言 2 环境搭建 2.1 硬件准备 2.2 软件准备 2.3 驱动检查 3 TCP服务器通信配置与交互 3.1 硬件连接 3.2 开启TCP服务器 3.3 打开配置工具读取基本信息 3.4 填写连接参数进行连接 3.5 通信测试 4 总结 1 前言 TCP是TCP/IP体系中的传输层协议&#xff0c;全称为Transmiss…

ESP32开发之LED闪烁和呼吸的实现

硬件电路介绍GPIO输出模式GPIO配置过程闪烁灯的源码LED PWM的控制器(LEDC)概述LEDC配置过程及现象整体流程 硬件电路介绍 电路图如下&#xff1a; 只要有硬件基础的应该都知道上图中&#xff0c;当GPIO4的输出电平为高时&#xff0c;LED灯亮&#xff0c;反之则熄灭。如果每间…

【产品业务设计】支付业务设计规范细节记录,含订单记录、支付业务记录、支付流水记录、退款业务记录

【产品业务设计】支付业务设计规范细节记录&#xff0c;含订单记录、支付业务记录、支付流水记录 前言 我为什么要写这个篇文章 总结设计经验生成设计模板方便后期快速搭建 一个几张表 一共5张表&#xff1b; 分别是&#xff1a; 订单主表&#xff1a;jjy_orderMain订单产…

2025软件供应链安全最佳实践︱证券DevSecOps下供应链与开源治理实践

项目背景&#xff1a;近年来&#xff0c;云计算、AI人工智能、大数据等信息技术的不断发展、各行各业的信息电子化的步伐不断加快、信息化的水平不断提高&#xff0c;网络安全的风险不断累积&#xff0c;金融证券行业面临着越来越多的威胁挑战。特别是近年以来&#xff0c;开源…