news 2026/2/16 10:18:00

初始React@1

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
初始React@1

从今天开始学习React,学习笔记记录。

参考来源:https://www.bilibili.com/video/BV1wy4y1D7JT?p=5&vd_source=ee72dd280771c701b7484b49fa600ff3

一、React简介

1、官网

英文官网:https://reactjs.org/

中文官网:https://react.docschina.org/

2、介绍描述

1)用于动态构建用户界面的JavaScript(只关注于视图)

2)由Facebook开源

3、React的特点

1)声明式编码

2)组件化编码

3)React Native编写原生应用

4)高效(优秀的Diffing算法)

4、React高效的原因

1)使用虚拟(virtual)DOM,不总是直接操作页面真实DOM

2)DOM Diffing算法,最小化页面重绘

二、Hello React

1、项目结构

2、代码片段

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>hello-react</title> </head> <body> <!-- 准备好一个容器--> <div id="test"></div> <!-- 引入react核心库--> <script src="../js/react.development.js" type="text/javascript"></script> <!-- 引入react-dom, 用于支持react操作dom--> <script src="../js/react-dom.development.js" type="text/javascript"></script> <!-- 引入babel, 用于将jsx 转为js--> <script src="../js/babel.min.js" type="text/javascript"></script> <script type="text/babel"> /*这里一定要写babel*/ //1 创建虚拟DOM const vDom = <h1>Hello,React</h1>/*此处一定不要写引号,因为不是字符串*/ //2 渲染虚拟dom到页面 ReactDOM.render(vDom, document.getElementById('test')); </script> </body> </html>

3、运行结果

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/2/7 12:24:14

HoRain云--JavaScript导航神器:玩转WindowLocation

&#x1f3ac; HoRain 云小助手&#xff1a;个人主页 ⛺️生活的理想&#xff0c;就是为了理想的生活! ⛳️ 推荐 前些天发现了一个超棒的服务器购买网站&#xff0c;性价比超高&#xff0c;大内存超划算&#xff01;忍不住分享一下给大家。点击跳转到网站。 目录 ⛳️ 推荐 …

作者头像 李华
网站建设 2026/2/9 22:20:54

【面板数据】工业机器人进出口数据集(2012.1-2025.10)

我国工业机器人产量第一&#xff0c;应用广泛。产业规模全球领先&#xff1a;我国已成为全球最大机器人生产国&#xff0c;产量实现跨越式增长&#xff0c;从2015年的3.3万套跃升至2024年的55.6万套&#xff1b;应用深度与广度显著提升&#xff1a;工业机器人已覆盖国民经济71个…

作者头像 李华
网站建设 2026/2/15 3:26:44

vue3 新建文件store自动导入

store下新增个index.js用来做自动导入&#xff08;pinia使用可参考之前这篇文章 //使用pinia来管理全局状态 import { createPinia } from pinia // 自动导入所有 store 文件 const modulesFiles import.meta.glob(./modules/*.js, { eager: true }) const stores {}for (co…

作者头像 李华
网站建设 2026/2/12 20:51:17

资金管理平台的核心业务场景中,凡是涉及资金权属变动、资金形态转换、资金成本 / 收益确认的操作,都会触发会计核算需求。这些场景的核算结果需同步至财务系统(如 SAP FI 模块),确保资金流与账务流的

资金管理平台的核心业务场景中&#xff0c;凡是涉及资金权属变动、资金形态转换、资金成本 / 收益确认的操作&#xff0c;都会触发会计核算需求。这些场景的核算结果需同步至财务系统&#xff08;如 SAP FI 模块&#xff09;&#xff0c;确保资金流与账务流的一致性。结合软件外…

作者头像 李华