React入门学习笔记3

事件处理

  1. 通过onXxx属性指定事件处理函数(注意大小写 )
    1. React使用的是自定义 (合成)事件, 而不是使用的原生DOM事件------为了更好的兼容性 eg:οnclick==》onClick
    2. React中的事件是通过事件委托方式处理的(委托给组件最外层的元素)------为了更高效
  2. 通过event.target 得到发生事件的DOM元素对象------所以不要过度使用ref
  3. 当事件项和操作项是同一个时无需使用ref

非受控组件

数据现用现取

调用event.preventDefault()阻止表单提交

受控组件

优势就是双向绑定,能省掉ref

很明显,这样子实在是太麻烦了。。所以就有了⬇

高阶函数------函数柯里化

如果一个函数符合下面2个规范中的任何一个,那该函数就是高阶函数。

1.若A函数,接收的参数是一个函数 ,那么A就可以称之为高阶函数。

2.若A函教,调用的返回值依然是一个函数,那么A就可以称之为高阶函数。

常见的高阶函数有:Promise、setTimeout、arr.map()等等

函数的柯里化: 通过函数调用继续返回函数 的方式,实现多次接收参数最后统一处理的函数编码形式。

重点就是分步接受参数并在最后统一处理!!

这里运用了闭包

指定参数属性名用方括号!!!

细品上面的例子,非常巧妙。

但其实,也可以一次性获取参数和event,只需要在调用时写个内联函数

相关推荐
7***A44314 小时前
Vue自然语言处理应用
前端·vue.js·自然语言处理
徐小夕14 小时前
耗时一周,我把可视化+零代码+AI融入到了CRM系统,使用体验超酷!
javascript·vue.js·github
高阳言编程14 小时前
vue2 + node + express + MySQL 5.7 的购物系统
前端
5***a97514 小时前
React Native性能优化技巧
javascript·react native·react.js
y***548814 小时前
React依赖
前端·react.js·前端框架
2***B44914 小时前
React测试
前端·react.js·前端框架
A3608_(韦煜粮)14 小时前
深入理解React Hooks设计哲学与实现原理:从闭包陷阱到并发模式
javascript·性能优化·react·前端开发·react hooks·并发模式·自定义hooks
5***o50014 小时前
React自动化测试
前端·react.js·前端框架
T***u33314 小时前
React部署
前端·react.js·前端框架
Jing_Rainbow14 小时前
【AI-7 全栈-2 /Lesson16(2025-11-01)】构建一个基于 AIGC 的 Logo 生成 Bot:从前端到后端的完整技术指南 🎨
前端·人工智能·后端