[react] React的事件和普通的HTML事件有什么不同

区别：

对于事件名称命名方式，原生事件为全小写，react 事件采用小驼峰
对于事件函数处理语法，原生事件为字符串，react 事件为函数
react 事件不能采用 return false 的方式来阻止浏览器的默认行为

合成事件是 react 模拟原生 DOM 事件所有能力的一个事件对象
优点：

兼容所有浏览器，更好的跨平台
将事件统一存放在一个数组，避免频繁的新增与删除（垃圾回收）
方便 react 统一管理和事务机制

事件的执行顺序为原生事件先执行，合成事件后执行，合成事件会冒泡绑定到 document 上，所以尽量避免原生事件与合成事件混用，如果原生事件阻止冒泡，可能会导致合成事件不执行，因为需要冒泡到document 上合成事件才会执行

[react] 在React中怎么阻止事件的默认行为？

event.preventDefault();阻止浏览器默认行为，例如标签不跳转
event.stopPropagation();阻止冒泡；例如上级点击事件不生效

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

[react] React的事件和普通的HTML事件有什么不同相关推荐

[react] React的触摸事件有哪几种？
[react] React的触摸事件有哪几种? onTouchCancel onTouchEnd onTouchMove onTouchStart 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放 ...
在react里实现点击回车键执行事件
在网页应用里,我们搜索.提交账户名密码等等操作的过程中,不太经常会去一个个用鼠标点击提交或者执行某个按钮类型的操作.对于我个人而言,直接用回车键就很顺手了,鼠标还要去定位,很麻烦. 这几天在搭建一个前 ...
探究react的事件机制（合成事件）
一.react的事件机制 react自身实现了一套事件机制,包括事件的注册.事件的存储.事件的合成及执行等. react 的所有事件并没有绑定到具体的dom节点上而是绑定在了document 上,然后 ...
react合成事件和DOM原生事件的区别
事件流在了解事件之前先来看一下什么是事件流. '流'这个名词在JS中随处可见.像DOM事件流.React中的数据流等等. 其实,流就是一种有方向的数据:事件流,是页面接受事件的顺序. 一.DOM事件 ...
【笔记-node】《Egg.js框架入门与实战》、《用 React+React Hook+Egg 造轮子全栈开发旅游电商应用》
20210226-20210227:<Egg.js框架入门与实战> 课程地址:https://www.imooc.com/learn/1185 第一章课程导学 01-01 课程介绍一. ...
深入学习SAP UI5框架代码系列之三：HTML原生事件 VS UI5 Semantic事件
这是Jerry 2020年的第80篇文章,也是汪子熙公众号总共第262篇原创文章. 系列目录 (0) SAP UI5应用开发人员了解UI5框架代码的意义 (1) UI5 module懒加载机制 (2) ...
[react] react组件的state和props两者有什么区别？
[react] react组件的state和props两者有什么区别? State 是一种数据结构,用于组件挂载时所需数据的默认值.State 可能会随着时间的推移而发生突变,但多数时候是作为用户事件 ...
[react] react中什么是非控组件？
[react] react中什么是非控组件? 表单元素的value/checked值.onChange事件没有和组件的state存在绑定关联关系,如果需要获取表单元素的值,需要使用ref获取DOM,然 ...
[react] react中的setState是同步还是异步的呢？为什么state并不一定会同步更新？
[react] react中的setState是同步还是异步的呢?为什么state并不一定会同步更新? 由React控制的事件处理程序,以及生命周期函数调用setState不会同步更新state . ...

[react] React的事件和普通的HTML事件有什么不同

[react] React的事件和普通的HTML事件有什么不同

[react] 在React中怎么阻止事件的默认行为？

个人简介

主目录

[react] React的事件和普通的HTML事件有什么不同相关推荐

最新文章

热门文章