根据之前我们所学的基础知识，包括虚拟DOM和Diff算法的了解，我们也要去接触React的脚手架的概念和React的设计理念是什么？才能更好的掌握这门语言
组件化思维
每个组件都符合开放—封闭原则，封闭是针对渲染工作流来说的，指的是组件内部的状态都由自身维护，只处理内部的渲染逻辑。开放是针对组件通信来说的，指的是不同组件可以通过props（单项数据流）进行数据交互
数据驱动视图
虚拟DOM
由浏览器的渲染流水线可知，DOM操作是一个昂贵的操作，很耗性能，因此产生了虚拟DOM。虚拟DOM是对真实DOM的映射，React通过新旧虚拟DOM对比，得到需要更新的部分，实现数据的增量更新
用脚手架创建React项目
- 全局安装 React 脚手架：npm i -g create-react-app
- 创建项目：create-react-app 项目名称
- 进入文件夹：cd 项目名称
- 启动项目：npm start
- 详见官方说明(opens new window)
脚手架的静态结构目录
public ：静态资源文件
- manifest.json ：应用加壳（把网页变成安卓/IOS 软件）的配置文件
- robots.txt ：爬虫协议文件
src ：源码文件
- App.test.js ：用于给 App 组件做测试，一般不用
- index.js ：入口文件
- reportWebVitals.js ：页面性能分析文件，需要 web-vitals 库支持
- setupTests.js ：组件单元测试文件，需要 jest-dom 库支持
- index.html分析：
讯享网
脚手架的配置代理
方式一：
在package.json文件中进行配置==>“proxy”：“http://localhost:5000"
- 优点：配置简单，前端请求资源可不加前缀
- 缺点：不能配置多个代理
- 工作方式：当请求了3000端口号（本机）不存在的资源时，就会把请求转发给5000端口号服务器去工作
方式二：
在src目录在新建代理配置文件setupProxy.js文件，进行配置
讯享网
这是React中兄弟组件或任意组件之间的通信方式
使用的工具库：PubSubJS(opens new window)
下载安装 PubSubJS ：npm install pubsub-js –save
有不明白的或者有其他问题的可以评论区留言噢
今天的知识分享就到这里啦~希望大家在这能学到知识一起分享一起进步，成为更好的自己！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/197010.html