React
像费曼%
这个作者很懒,什么都没留下…
展开
-
React--纯组件
state或props中属性值为引用类型时,应该创建新数据,不要直接修改原数据。引用类型的比较:(因为两者的地址一样,无论怎样点击按钮,都不会进行渲染)原创 2022-08-04 11:52:03 · 492 阅读 · 0 评论 -
React--组件更新机制&组件性能优化
更加简洁的写法:if nextState.number!1.2过程:父组件重新渲染时,也会重新渲染子组件。但只会渲染当前组件子树(当前组件及其所有子组件)4.使用另外一个参数(nextProps)3.避免不必要的重新渲染。...原创 2022-08-04 10:11:27 · 2243 阅读 · 0 评论 -
React--JSX语法的转化过程
2.JSX语法按@babel/preset-react插件编译为createElement()方法。1.JSX仅仅是createElement()方法的语法糖(简化语法)3.React元素:是一个对象,用来描述你希望在屏幕上看到的内容。原创 2022-08-03 17:52:06 · 232 阅读 · 0 评论 -
React----setState()的说明
语法:setState(update,[callback])场景:在状态更新(页面完成重新渲染)后立即执行某个操作。原创 2022-08-03 14:33:58 · 129 阅读 · 0 评论 -
React之高阶组件
不知道为什么在浏览器无法显示效果,但也没有报错!提供复用的状态逻辑代码。提供复用的状态代码逻辑。原创 2022-08-03 13:37:12 · 174 阅读 · 0 评论 -
render-props和高阶组件
data参数表示接收到的数据---data原创 2022-07-31 11:07:19 · 209 阅读 · 1 评论 -
React--组件的生命周期
1.3创建时(挂载阶段)1.5卸载时(卸载阶段)1.2生命周期的三个阶段。1.1组件生命周期概述。只有类组件才有生命周期。原创 2022-07-28 12:09:41 · 323 阅读 · 2 评论 -
React--props深入
表示组件标签的子节点。当组件标签有子节点时,props就会有该属性。子节点可以传入各种类型的数据(文本、React元素、组件、甚至是函数)作用给props设置默认值,在未传入props时生效。2.3props校验使用步骤。2.2什么是props检验。1.children属性。2.3props约束规则。3.props的默认值。2.1props校验。...原创 2022-07-28 09:52:04 · 111 阅读 · 0 评论 -
React:‘XXX’ is defined but nerver used的解决方法
但是React的基础课程还没学完,只好以这种半桶水的知识与头脑去做项目,难免会遇到很多困难。原因想引入Login组件,但是一直显示“组件被定义但从未使用”的字样,但是我明明就有引用吖!解决方法原来是组件的文件名首字母需要大写!...原创 2022-07-25 16:29:32 · 575 阅读 · 0 评论 -
React表单验证
为防止用户的恶搞,即提示错误信息时依然点击注册按钮,此时弹出弹框提示“请完善用户信息”。在写表单验证时,经过不断完善使得表单失去焦点时会提示错误信息。下面为表单验证1.0版本,2.0版本没有展示出来。...原创 2022-07-25 10:24:23 · 1155 阅读 · 0 评论 -
React表单处理
1.受控组件1.2多表单元素优化步骤原因:一个一个绑定太麻烦1.3非受控组件原创 2022-07-14 16:57:29 · 233 阅读 · 0 评论 -
React有状态组件和无状态组件
1.分别是什么案例如下:(需要使用有状态组件完成)1.2state的基本使用1.3setState()修改状态信息是可变的语法:this.setState({要修改的数据})注意:不要直接修改state中的值,这是错误的!!!!setState()作用:1.修改state 2.更新UI思想:数据驱动视图1.4从JSX中抽离事件处理程序1.4.1箭头函数利用箭头函数自身不绑定this的特点1.4.2Funtion.prototype.bind()利用ESS中的bind方法,将事件处理程序中的thi原创 2022-07-14 08:50:46 · 776 阅读 · 0 评论 -
React事件处理
1.事件绑定1.1事件对象原创 2022-07-13 21:34:06 · 172 阅读 · 0 评论 -
React组件
1.React组件介绍2,使用组件的两种创建方式2.1使用函数创建组件2.2使用类创建组件原创 2022-07-13 16:00:00 · 82 阅读 · 0 评论 -
JSX的基本使用
1.1createElement()的问题1.2JSX简介JSX是JavaScript XML地简写,表示在JavaScript代码中写XML(HTML)格式的代码。优势:声明式语法更加直观、与HTML结构相同,降低了学习成本、提升开发效率1.3为什么脚手架中可以使用JSX语法1.4注意点1.5JSX使用步骤2.JSX中使用JavaScript表达式嵌入JS表达式使用JavaScript注意点注意点3.JSX的条件渲染4.列表渲染5.使用className的方式给JSX添加样式推荐使用c原创 2022-07-13 11:07:14 · 88 阅读 · 0 评论 -
React概述
1.什么是React1.2React的使用在vscode终端执行 npm i react react-dom1.3使用React脚手架初始化项目React脚手架的意义npx命令介绍:推荐使用:npx create-react-app my-app启动项目:npm start、yarn start在脚手架中使用React在 src–>index.js...原创 2022-07-13 08:54:47 · 65 阅读 · 0 评论