企业官网建设流程全解析

一．前端react界面：

react学习：【30分钟学会React18核心语法 可能是你学会React最好的机会 前端开发必会框架 无废话精品视频】https://www.bilibili.com/video/BV1pF411m7wV?vd_source=1e47a7fc67a927e48a137297bdfa80e9

（一）终端：

npx create-react-app my-react-app

cd my-react-app

Npm start启动项目

用脚手架自动搭建项目的工具

JSX 就是相当于把JS和HTML结合

JSX只能返回一个根元素：

想要多个解决办法就是在外面加一个空标签：<></>

JSX必须遵循标签闭合: 普通：<div></div> 自闭合：<app />二者等价 <div></div>内容呈现

渲染 = 代码 → 变成看得见的页面

（二）插值：<div>所需要的都放在这里</div>

（三）条件渲染：

用if来

<span></span>是普通容器

<p></p>是段落标签而且会自动换行

（四）列表渲染：

<ul></ul>无序（会打.而且有缩进）， <li></li>有序

<Fragment></Fragment>嵌套可以直接多标签

（五）事件：点击事件 useState更改数据状态

console是控制台的意思 log打印 onClick驼峰写法：中间的要大写

代码意思是只要点击了就打印那句话

5.1 useState更新数据

5.2更新列表：不管有没有更改都要先写一遍...data 再写更改的东西

5.3更改数组：Fliter()过滤掉自己不想要的数据

这里也可以添加新的数组的元素！

++data是先加后用， data++是先用后加

（六）useEffect()：副作用--渲染之后，再干点别的

6.1 空数组 [] → 只执行一次（页面刚加载时）

6.2 不传数组 → 每次渲染都执行（慎用！）

6.3 带依赖 [a, b] → 依赖变了才执行