![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
文章平均质量分 53
react笔记
蜕.
性格码农在线写笔记~~
展开
-
react-query
react-query原创 2022-08-05 14:03:59 · 683 阅读 · 0 评论 -
Hook API
HookAPI、useState、useEffect等原创 2022-07-29 11:51:31 · 373 阅读 · 0 评论 -
react_redux
Redux解决React数据管理(状态管理),用于中大型,数据比较庞大,组件之间数据交互多的情况下。如果你不知道是否需要使用Redux,那么你就不需要用它。解决组件的数据通信解决数据和交互较多的应用store:数据仓库,保存数据state:对象,数据仓库里的所有数据都放到1个state里action:动作,触发数据改变的方法dispatch:将动作触发成方法reducer:函数,通过获取动作,改变数据,生成一个新的state,从而改变页面npm i --save redux..原创 2021-01-25 16:36:46 · 76 阅读 · 0 评论 -
react路由
路由ReactRouter三大组件:Router:所有路由组件的根组件(底层组件),包括路由规则的最外层容器,可以再一个组件写多个Route:路由规则匹配组件,显示当前规则对应的组件Link:路由跳转的组件,to属性可以传路径也可以传对象;replace属性点击链接后,直接替换成历史访问记录的原地址动态路由:function Product(props) { return ( <div> <h1>产品页面,产品ID:{props.match.par原创 2021-01-24 01:33:43 · 76 阅读 · 0 评论 -
react生命周期
生命周期生命周期即是组件从实例化到渲染到最终从页面中销毁,整个过程就是生命周期。在这个生命周期中,有许多可以调用的事件,俗称钩子函数。生命周期的三个状态Mounting: 将组件插入到DOM中Updating: 将数据更新到DOM中Unmounting: 将组件移除DOM中生命周期中的钩子函数(方法、事件)官方文档:https://zh-hans.reactjs.org/docs/react-component.html这是官方16.4版本的生命周期,灰色为不常用的生命周期,还有原创 2021-01-21 22:33:08 · 84 阅读 · 0 评论 -
react条件/列表渲染
React条件渲染React条件渲染和JavaScript的条件运算,如if…else、三元运算符差不多直接通过条件运算返回要渲染的JSX对象通过条件运算得出JSX对象,再将JSX对象渲染到模板中function UserGreet(props){ return (<h1>登录</h1>)}function UserLogin(props){ return (<h1>请先登录</h1>)}class Login extends Re原创 2021-01-20 23:10:40 · 76 阅读 · 0 评论 -
react事件
react事件特点:绑定事件的命名(驼峰命名法){}里面传入函数,而不是字符串<button onClick={this.sendData}>传递msg到父元素</button>注意:react返回的对象是代理的原生的事件对象,如果要查看事件对象的具体值,可以输出对象的属性原生中阻止默认行为时,可以直接返回return false,但是react中,阻止默认必须使用e.preventDefault() render() { return (原创 2021-01-19 00:34:25 · 67 阅读 · 0 评论 -
react父子数据传递
父传子.content{ width: 400px; height: 400px; background-color: skyblue; display: none;}.content.active{ display: block;}class ParentCom extends React.Component { constructor(props) { super(props) this.state = { isActive: true原创 2021-01-18 23:50:01 · 73 阅读 · 0 评论 -
react组件
React组件https://blog.csdn.net/wu_xianqiang/article/details/91320529定义组件有两个要求:组件名称必须以大写字母开头组件的返回值只能有一个根元素react函数组件function Clock(props) { return ( <div> <h1>当前时间:{props.date.toLocaleTimeString()}</h1> </div>原创 2021-01-17 16:58:07 · 113 阅读 · 0 评论 -
react入门
React特点声明式的设计高效,采用虚拟DOM实现DOM的渲染,最大限度的减少DOM的操作灵活,可以跟其他的库灵活搭配使用JSX(语法糖),俗称在JS里面写HTML,JavaScript语法的扩展组件化,模块化,代码容易复用,16年之前大型项目很喜欢react,现在大多数都用Vue单向数据流,没有实现数据的双向绑定。数据->视图->事件->数据这样一个闭环React.StrictModehttps://blog.csdn.net/weixin_42566993/art原创 2021-01-16 23:02:47 · 87 阅读 · 0 评论