React脚手架-详细解析目录与运行

news2024/12/24 0:01:54

分析执行流程就是:导库 -> 页面节点 -> 组件 -> 组件挂载页面

这里面核心就是   页面节点index.html  、 组件挂载页面 index.js 、 组件render  App.js

index.css 是对页面的渲染(通用型样式) 、App.css 是对组件的渲染

首先就是执行入口文件 index.js   -- 核心功能就是将组件挂载到页面index.html中的页面节上

此文件引入React、react-dom核心库,(还有周边index.css)同时引入App.js

进入App.js 组件执行render,在App.js 中使用ES6模块语法将此组件 默认暴露 使得index.js 可以找到,(还有周边App.css),最后挂载到页面上。

如今都是SPA(single page application)单一页面应用 只有一个主页面,且只有一个节点!!!!

不然你组件没法放页面啊 并且由于ReactDOM.render()是覆盖渲染不是追加 所以App的div只有一个

其余的组件分别在唯一div指定位置渲染即可

页面的节点:可看做DOM树的一个个元素;又可以看做一个个容器,组件在指定容器内渲染

但只能有一个根节点!!!

其余文件只是某些场景使用。

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

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

相关文章

【51单片机】9-定时器和计数器

1.定时器的介绍 1.什么是定时器 (1)SoC的一种内部的外设【在单片机里面,但是在CPU外面】 (2)定时器就是CPU的”闹钟“ 2.什么是计数器 (1)定时器就是用计数的原始实现的 (2&#xf…

PyCharm中使用pyqt5的方法2-2

1.2 是否下载成功 按照以上步骤安装了“pyqt5”、“pyqt5-tools”模块和“pyqt5designer”模块后,可以打开保存这三个模块的路径,找到其对应的文件夹,即可验证是否下载成功。 获取PyCharm保存下载模块路径的方法是,在PyCharm界面…

Blender 之创建一个简单的笔筒

文章目录 成品图实现步骤 你是不是想创建一个笔筒捏? follow me! 成品图 实现步骤 先添加一个柱体 选中柱体,然后按tab 进入编辑模式 切换到面模式 (可以按主键盘的 3 键) 分别选中上下面,鼠标右键,选…

风力发电一键求助可视对讲终端

SV-11SV 风力发电一键求助可视对讲终端 SIP可视对讲终端SV-11SV是专门针对行业用户需求研发的一款高性价比SIP可视对讲产品,外观精致,功能强大,集智能安防、音/视频对讲和广播功能于一体,性价比高。支持壁挂式安装方式。防护等级满…

安达发|在国外APS自动排程软件案例比比皆是

在国外,APS(自动排程系统)的应用已经非常普遍,它们在各个领域都取得了显著的成果。本文将为您详细介绍国外APS自动排程的案例,以及它们在实际生产中的价值和意义。 1. 制造业 在制造业领域,APS自动排程系统…

JDK下载安装配置教材

1.JDK下载 目前市面上的公司大多数采用的是jdk8进行开发 ,所以本文就以jdk8的下载安装配置为例来讲解。 因为Oracle的官网地址访问网速比较慢,所以下载速度较慢,本文我演示的是jdk8的下载,如果需要下载jdk8的小伙伴可以直接在我…

26047-2022 一次柱式锂电池绝缘子 思维导图

声明 本文是学习GB-T 26047-2022 一次柱式锂电池绝缘子. 而整理的学习笔记,分享出来希望更多人受益,如果存在侵权请及时联系我们 1 范围 本文件规定了一次柱式锂电池绝缘子产品的分类和标记、技术要求、试验方法、检验规则、标志、包 装、运输、贮存和随行文件及订货单内容…

【JVM】第四篇 垃圾收集器ParNewCMS底层三色标记算法详解

导航 一. 垃圾收集算法详解1. 分代收集算法2. 标记-复制算法3. 标记-清除算法4. 标记-整理算法二. 垃圾收集器详解1. Serial收集器2. Parallel Scavenge收集器3. ParNew收集器4. CMS收集器三. 垃圾收集底层三色标记算法实现原理1. 垃圾收集底层使用三色标记算法的原因?2. 垃圾…

C++ - set 和 map 的实现(下篇)- set 和 map 的迭代器实现

前言 在上篇当中我们为了 让红黑树适用于 set 和 map 对红黑树进行了修改,还是实现了红黑树的迭代器,因为 set 和 map 的底层都是使用 红黑树,那么,set 和 map 的迭代器也就实现了。具体可以看本博客的上篇:C - map 和…

Windows提权辅助工具WES-NG使用

Windows提权辅助工具WES-NG使用 1.下载安装2.开始使用1.下载安装 WES-NG 执行此命令更新CVE数据库: python wes.py --update2.开始使用 首先,生成系统systeminfo信息,并重定向一个txt文件中: systeminfo > systeminfo.txt查找提权可以利用的CVE: python wes.py s…

还不知道数据类岗位的相关技能和职责吗?涤生大数据告诉你(二)

续接上文:还不知道数据类岗位的相关技能和职责吗?涤生大数据告诉你(一) 1.数据治理工程师 工作职责 数据治理工程师的工作职责主要包括以下几个方面: 1. 数据管理策略制定:制定和实施数据管理策略&#…

【HCIE】VXLAN

VXLAN简介 介绍VXLAN的定义、目的和收益。 定义 RFC7348定义了VLAN扩展方案VXLAN(Virtual eXtensible Local Area Network)。VXLAN采用MAC in UDP(User Datagram Protocol)封装方式,是NVO3(Network Virt…

YashanDB向量化执行引擎如何给海量数据分析提速

作者介绍:李伟超,数据库系统架构师,YashanDB架设技术开发负责人,10年以上数据库内核技术开发经验。 *全文4510个字,阅读时长约11分钟。 背景 海量数据OLAP场景,通常具有数据规模大、查询复杂度高、处理速…

【ESP-IDF篇】搭建ESP-IDF软件开发环境,包括手动命令行和VSCode两种方式

忘记过去,超越自己 ❤️ 博客主页 单片机菜鸟哥,一个野生非专业硬件IOT爱好者 ❤️❤️ 本篇创建记录 2023-09-27 ❤️❤️ 本篇更新记录 2023-09-27 ❤️🎉 欢迎关注 🔎点赞 👍收藏 ⭐️留言📝&#x1f64…

三相无感正弦波 BLDC 驱动MS39539/MS39535

产品简述 MS39539 和 MS39535 是无感三相直流电机驱动芯片,采用 正弦波驱动方式,具有低噪声及低震动的特点。 MS39539 和 MS39535 特别针对电机启动进行了优化,相比 MS39549 和 MS39545 适用于反向电动势更小的电机。 有一个速…

《数据结构、算法与应用C++语言描述》-栈的应用-列车车厢重排问题

列车车厢重排问题 一列货运列车有 n 节车厢,每节车厢要停靠在不同的车站。假设 n个车站从 1 到n 编号,而且货运列车按照从n到1的顺序经过车站。车厢的编号与它们要停靠的车站编号相同。为了便于从列车上卸掉相应的车厢,必须按照从前至后、从…

c语言练习68:文件的随机读写

文件的随机读写 fseek fseek 根据⽂件指针的位置和偏移量来定位⽂件指针。 1 int fseek ( FILE * stream, long int offset, int origin ); 例子&#xff1a; /* fseek example */ #include <stdio.h> int main () {FILE * pFile;pFile fopen ( "example.txt&…

接口测试的总结文档

接口测试的总结文档 第一部分&#xff1a;主要从问题出发&#xff0c;引入接口测试的相关内容并与前端测试进行简单对比&#xff0c;总结两者之前的区别与联系。但该部分只交代了怎么做和如何做&#xff1f;并没有解释为什么要做&#xff1f; 第二部分&#xff1a;主要介绍为什…

Java流的体系结构(一)

文章目录 一、文件读写操作FileReader和FileWriter1.main()2.FileReader1.说明&#xff1a;2.代码案例 3.对read()操作升级&#xff1a;使用read的重载方法4.FileWriter的使用1.说明2.代码 4.FileReader和FileWriter综合使用 二、使用步骤1.引入库 二、测试FileInputStream和Fi…

新型信息基础设施IP追溯:保护隐私与网络安全的平衡

随着信息技术的飞速发展&#xff0c;新型信息基础设施在全球范围内日益普及&#xff0c;互联网已经成为我们社会和经济生活中不可或缺的一部分。然而&#xff0c;随着网络使用的增加&#xff0c;隐私和网络安全问题也引发了广泛关注。在这个背景下&#xff0c;IP&#xff08;In…