React入门

一、认识react框架

 

• 定义：用于构建用户界面的js库
• 历史：facebook开发，且开源
• 参考：

        React英文文档（https://reactjs.org/）

        React中文文档 （https://zh-hans.reactjs.org/）

二、基础环境搭建，并认识目录及简化

1、利用react脚手架新建项目

前提是你已经安装了Node.js

node -v 命令可检查，如果没有出现如下版本号代表未下载，可到node官网下载安装

 

新建项目命令：

npx create-react-app react-test

•  create-react-app 是React脚手架的名称
•  react-test 表示项目名称，可以自定义
•  npx 命令会帮助我们临时安装create-react-app包，然后初始化项目完成之后会自自动删掉，所以不需要全局 安装create-react-app

2、认识并简化目录

src文件夹下只留下三个：App.js、index.css、index.js

注意删除他们之前的引用代码

• index.js中：react是框架核心包，reactDOM是渲染相关的包
• index.css:是全局样式文件
• App.js:根组件

把根组件渲染到public文件夹下的index.html的id为root的位置上

四、其他问题说明

如果现在用的版本在react18及以上，需要暂时去掉严格模式节点，因为会影响useEffect的执行时机。因为要检测额外的副作用，导致业务执行两次

 注：文章是根据b站柴柴老师的react课程做的记录，react课程