本文介绍了React中类组件与函数组件绑定事件的区别，强调了合成事件的特点，包括兼容性、接口和获取原生事件对象的方法。同时提到了前端开发者如何通过系统学习和面试准备来提升技能，分享了前端面试题汇总资源。
4.类组件与函数组件绑定事件是差不多的，只是在类组件中绑定事件函数的时候需要用到this，代表指向当前的类的引用，在函数中不需要调用this
class App extends React.Component{
// 事件处理函数
handleClick() {
console.log(‘点我就好了’)
}
render() {
return (
点我了吗
)
}
}
2.事件对象
1.可以通过事件处理函数的参数获取到事件对象;
2.React中的时间对象叫:合成事件;
3.合成事件:兼容所有浏览器,无需担心夸浏览器兼容问题;
4.除了兼容所有浏览器外,还拥有和浏览器原生事件相同的接口,包括stopPropagation()和 preventDefault()
5.若想获取到原生事件对象,可以通过nativeEvent属性获取
class App extends React.Component{
// 事件对象
handleClick(e){
// 阻止默认行为
e.preventDefault()
console.log(‘a标签的单机事件触发了’)
}
render() {
return (
)
}
}
获取原生事件对象
class App extends React.Component{
// 事件处理函数
handleClick(e) {
console.log(e.nativeEvent)
}
render() {
return (
点我了吗
)
}
}
3.支持的事件
-
Clipboard Events 剪切板事件
-
事件名 ：onCopy onCut onPaste
-
属性 ：DOMDataTransfer clipboardData
-
compositionEvent 复合事件
-
事件名： onCompositionEnd onCompositionStart onCompositionUpdate
-
属性： string data
-
Keyboard Events 键盘事件
-
事件名：onKeyDown onKeyPress onKeyUp
-
属性： 例如 number keyCode 太多就不一一列举
-
Focus Events 焦点事件 （这些焦点事件在 React DOM 上的所有元素都有效，不只是表单元素）
-
事件名： onFocus onBlur
小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。
深知大多数初中级前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！
因此收集整理了一份《2024年Web前端开发全套学习资料》送给大家，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。
由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频
如果你觉得这些内容对你有帮助，可以添加下面V无偿领取！（备注：前端）
总结一下
面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。
还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。
万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
为了帮助大家更好更高效的准备面试，特别整理了《前端工程师面试手册》电子稿文件。
前端面试题汇总
电子稿文件。
前端面试题汇总
扫一扫
4255
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
