react-day1

1.react是什么呢?

react是由Meta公司开发,是一个用于构建web和原生交互界面的库

2.react 项目修改文件保存后

,不能实时更新,需要:
在和package.json文件同目录的地方,新建.env文件:里面加入:

FAST_REFRESH=false

上面的代码保存即可

3.主要文件的解读:

1.入口文件:index.js

// 项目的入口文件  从这里开始运行// React中必要的两个核心包
import React from "react";
import ReactDOM from "react-dom/client";// 导入项目的根组件
import App from "./App";// 把App根组件渲染到id为root的dom节点上
// 这个dom节点就是public文件夹中的index.html文件中的  <div id="root"></div>
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<App />);

2.根组件:App.js

// 项目的跟组件
// 根组件APP--->被引入到入口文件index.js中 -->入口文件被渲染到public中的index.html的root节点上function App() {return <div className="App">this is react 111a22pp</div>;
}export default App;

3.项目整体的文件目录如下:
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL数据操作与查询- 连接查询

一、引入 1、为什么需要使用连接查询&#xff1f; 查询信息的来源如果来自多张表&#xff0c;则必须对这些表进行连接查询。 2、连接查询的分类 内连接和外连接。 二、内连接 1、概述 将两张表的记录组合在一起&#xff0c;产生一个新的结果。 &#xff08;1&#xff09…

C++初学者指南第一步---2. Hello world

C初学者指南第一步—2. Hello world 目录 C初学者指南第一步---2. Hello world1.源文件 “Hello.cpp”2.编译hello.cpp3.术语4.编译器标志5.不要使用 “using namespace std;” &#xff01; 1.源文件 “Hello.cpp” #include <iostream> // our first program int main…

SqlSugar使用DbFirst对象根据数据库表结构创建实体类-C#

本文所述开发环境&#xff1a;.C#、NET8、Visual Studio2022 1. 在项目中安装SqlSugar 在Visual Studio2022中新建一个 C# 的控制台应用程序&#xff0c;框架选择 .Net8。新建后如下图所示&#xff1a; 然后打开NuGet程序包管理器 搜索 SqlSugarCore 并安装 安装后在解决方案…

【Linux】 进程信号的发生

送给大家一句话&#xff1a; 何必向不值得的人证明什么&#xff0c;生活得更好&#xff0c;乃是为你自己。 -- 亦舒 进程信号的发生 1 何为信号2 信号概念的基础储备3 信号产生kill系统调用alarm系统调用异常core term Thanks♪(&#xff65;ω&#xff65;)&#xff89;谢谢…

会声会影色彩校正在哪里 会声会影色彩素材栏在哪 会声会影中文免费版下载

会声会影是一款功能强大的视频编辑软件&#xff0c;它可以帮助用户轻松地编辑和制作视频。在进行视频编辑时&#xff0c;色彩校正是一个重要的步骤&#xff0c;它可以调整视频的色调、亮度和对比度等参数&#xff0c;使视频更加生动和鲜明。在会声会影中&#xff0c;色彩校正功…

linux 部署瑞数6实战(维普,药监局)第一部分

声明 本文章中所有内容仅供学习交流使用&#xff0c;不用于其他任何目的&#xff0c;抓包内容、敏感网址、数据接口等均已做脱敏处理&#xff0c;严禁用于商业用途和非法用途&#xff0c;否则由此产生的一切后果均与作者无关&#xff01;wx 本文章未经许可禁止转载&…

深入浅出談 隐马尔可夫的概念(2/ 2)-- 训练理论

文章目录 一、说明二、HMM 三大问题三、评估问题——前向-后向算法四、.解码问题——维特比算法五、学习问题——EM算法六、 连续隐马尔可夫 一、说明 在许多机器学习的章节中&#xff0c;常常遇见 HMM &#xff0c;往往看到它的数学式子后&#xff0c;就当没看到似的跳过去了…

【Python网络爬虫分步走】使用LXML解析网页数据

Python网络爬虫分步走 – 使用LXML解析网页数据 Web Scraping in Python - Using LXML to Parse Web Data By Jackson@ML Lxml作为Python的第三方库,提供易用的且功能强大的API,用来解析XML和HTML文档。事件驱动的API被用于分步骤解析。 本文简要介绍使用lxml库解析网页的基…

UML与设计模式

1、关联关系 关联关系用于描述不同类的对象之间的结构关系&#xff0c;它在一段时间内将多个类的实例连接在一起。关联关系是一种静态关系&#xff0c;通常与运行状态无关&#xff0c;而是由“常识”、“规则”、“法律”等因素决定的&#xff0c;因此关联关系是一种强关联的关…

北斗三代一体式数传终端短报文

北斗三代一体式数传终端短报文M20C-V30针对船载通信和导航应用推出的一款支持北斗 RDSS/RNSS 功能的船载一体机。北斗数传终端内部集成了北斗多频天线、射频、基带以及主控等功能单元&#xff0c;可实现 RDSS 定位、短报文通信和 RNSS 导航定位等功能。M20C-V30型北斗数传终端体…

牛客练习题打卡(06-15)

run方法线程执行体 .start方法开启多线程 在java中 &#xff0c; 整数类型默认int,带小数默认double ; 如果要指定长整型加L&#xff1b;如果要指定为单精度加F ; 在java中&#xff0c;重载要求方法名相同&#xff0c; 参数列表必须不同&#xff08;个数不同、或类型不同、参数…

Nginx+KeepAlived高可用负载均衡集群的部署

目录 一.KeepAlived补充知识 1.一个合格的群集应该具备的特点 2.健康检查&#xff08;探针&#xff09;常用的工作方式 3.相关面试问题 问题1 问题2 二.Keepealived脑裂现象 1.现象 2.原因 硬件原因 运用配置原因 3.解决 4.预防 方法1 方法2 方法3 方法4 三.…

WWDC 2024 回顾:Apple Intelligence 的发布与解析

一年一度的苹果全球开发者大会&#xff08;WWDC&#xff09;如期而至&#xff0c;2024 年的 WWDC 再次成为科技界的焦点。本次发布会中&#xff0c;苹果正式推出了他们在 AI 领域的全新战略——Apple Intelligence。这一全新概念旨在为用户打造“强大、易用、全面、个性化、注重…

DC/AC电源模块:为电动车充电基础设施提供高效能源转换

BOSHIDA DC/AC电源模块&#xff1a;为电动车充电基础设施提供高效能源转换 DC/AC电源模块是一种用于电动车充电基础设施的重要组件&#xff0c;它能够实现高效能源转换。在电动车的普及和推广过程中&#xff0c;DC/AC电源模块的重要性日益凸显。本文将从DC/AC电源模块的基本原…

CSS 实现个人资料卡

CSS 实现个人资料卡 效果展示 CSS 知识点 CSS 综合知识运用 页面整体布局 <div class"card"><div class"imgBox"><img src"./bg.jpg" /></div><div class"content"><div class"details&quo…

springboot+vue前后端分离项目中使用jwt实现登录认证

文章目录 一、后端代码1.响应工具类2.jwt工具类3.登录用户实体类4.登录接口5.测试接口6.过滤器7.启动类 二、前端代码1.登录页index 页面 三、效果展示 一、后端代码 1.响应工具类 package com.etime.util;import com.etime.vo.ResponseModel; import com.fasterxml.jackson.…

38、基于卷积神经网络(CNN)的车牌自动识别系统(matlab)

1、原理及流程 1&#xff09;原理 CNN&#xff08;卷积神经网络&#xff09;是一种深度学习模型&#xff0c;可以用于图像识别和分类任务。车牌自动识别系统的原理基本上就是使用CNN模型对车牌图像进行处理和识别。 首先&#xff1a;系统需要收集大量的含有车牌的图像数据作…

Vue2+Element-ui实现el-table表格自适应高度

效果图 新建指令 Vue.directive(height, {inserted(el, _binding, vnode) {const paginationRef vnode.context.$refs.paginationRefconst calculateHeight () > {const windowHeight window.innerHeightconst topOffset el.getBoundingClientRect().topconst otherEle…

Java 网站开发入门指南:如何用java写一个网站

Java 网站开发入门指南&#xff1a;如何用java写一个网站 Java 作为一门强大的编程语言&#xff0c;在网站开发领域也占据着重要地位。虽然现在 Python、JavaScript 等语言在网站开发中越来越流行&#xff0c;但 Java 凭借其稳定性、可扩展性和丰富的生态系统&#xff0c;仍然…

【SpringBoot】SpringBoot:构建实时聊天应用

文章目录 引言项目初始化添加依赖 配置WebSocket创建WebSocket配置类创建WebSocket处理器 创建前端页面创建聊天页面 测试与部署示例&#xff1a;编写单元测试 部署扩展功能用户身份验证消息持久化群组聊天 结论 引言 随着实时通信技术的快速发展&#xff0c;聊天应用在现代We…