react基础知识总结

最新推荐文章于 2022-07-20 00:44:40 发布

____白山茶

最新推荐文章于 2022-07-20 00:44:40 发布

阅读量199

点赞数

分类专栏： react 文章标签： react.js

本文链接：https://blog.youkuaiyun.com/weixin_50805397/article/details/120073674

版权

本文总结了React的基础知识，包括虚拟DOM、组件（函数式与类组件）、路由、Redux以及组件间的通信。重点讲解了组件的声明式写法、状态管理和props的使用。还介绍了生命周期方法，如constructor、componentDidMount等，以及17版本后的新特性。最后，文章探讨了React的上下文（Context）机制，如何通过Provider和Consumer实现跨层级的数据传递。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

学习内容：
1.虚拟dom
2.组件：1.父子
2.子父
3.跨级
4.组件类型
3.路由：1.封装
2.路由表
3.路由传参
4.路由拦截
4.Redux:

虚拟dom:描述真实dom的一个对象。
jsx
react规定，在jsx中遇到{}使用js去编译；遇到<>使用html编译。
组件
函数式组件（无状态组件）
1.定义一个函数function (){}
2.此函数必须抛出，有return
3.此函数必须return一个标签
4.必须在js文件中抛出
类组件
1.引入react
2.使用class定义一个类 class Fun
3.此类继承react中的component方法class Fun extends React.Component{}
4.在组件使用render函数渲染元素 render(){return <div></div>}
5.render函数必须有返回，且必须是标签
声明式类组件
1.引入react
2.React.createClass(
<div></div>
)
state
1.函数式组件没有state和生命周期
2.在类组件中，直接使用state方法声明当前页面所有状态
3.获取：在页面的任何一个函数中，使用解构的方式去获取state中的状态 let {}=this.state;
修改：在页面的任何一个函数中，使用this.setState()方法修改state状态

最低0.47元/天解锁文章