react合成事件大全,如onClick,onDrag

1. 鼠標事件

  • onClick?- 點擊事件
  • onContextMenu?- 右鍵菜單事件
  • onDoubleClick?- 雙擊事件
  • onDrag?- 拖拽事件
  • onDragEnd?- 拖拽結束事件
  • onDragEnter?- 拖拽進入目標區域事件
  • onDragExit?- 拖拽離開目標區域事件
  • onDragLeave?- 拖拽離開事件
  • onDragOver?- 拖拽懸停事件
  • onDragStart?- 拖拽開始事件
  • onDrop?- 拖拽釋放事件
  • onMouseDown?- 鼠標按下事件
  • onMouseEnter?- 鼠標進入事件
  • onMouseLeave?- 鼠標離開事件
  • onMouseMove?- 鼠標移動事件
  • onMouseOut?- 鼠標移出事件
  • onMouseOver?- 鼠標懸停事件
  • onMouseUp?- 鼠標釋放事件

2. 鍵盤事件

  • onKeyDown?- 按鍵按下事件
  • onKeyPress?- 按鍵按壓事件(已廢棄)
  • onKeyUp?- 按鍵釋放事件

3. 表單事件

  • onChange?- 表單值變化事件
  • onInput?- 輸入事件
  • onInvalid?- 表單驗證失敗事件
  • onReset?- 表單重置事件
  • onSubmit?- 表單提交事件

4. 焦點事件

  • onFocus?- 獲取焦點事件
  • onBlur?- 失去焦點事件

5. 觸摸事件

  • onTouchCancel?- 觸摸取消事件
  • onTouchEnd?- 觸摸結束事件
  • onTouchMove?- 觸摸移動事件
  • onTouchStart?- 觸摸開始事件

6. UI 事件

  • onScroll?- 滾動事件

7. 圖像事件

  • onLoad?- 加載完成事件
  • onError?- 加載錯誤事件

8. 動畫事件

  • onAnimationStart?- 動畫開始事件
  • onAnimationEnd?- 動畫結束事件
  • onAnimationIteration?- 動畫迭代事件

9. 過渡事件

  • onTransitionEnd?- 過渡結束事件

10. 剪貼板事件

  • onCopy?- 復制事件
  • onCut?- 剪切事件
  • onPaste?- 粘貼事件

11. 媒體事件

  • onAbort?- 媒體加載中斷事件
  • onCanPlay?- 媒體可以播放事件
  • onCanPlayThrough?- 媒體可以完整播放事件
  • onDurationChange?- 媒體時長變化事件
  • onEmptied?- 媒體資源清空事件
  • onEncrypted?- 媒體加密事件
  • onEnded?- 媒體播放結束事件
  • onLoadedData?- 媒體數據加載完成事件
  • onLoadedMetadata?- 媒體元數據加載完成事件
  • onLoadStart?- 媒體開始加載事件
  • onPause?- 媒體暫停事件
  • onPlay?- 媒體播放事件
  • onPlaying?- 媒體正在播放事件
  • onProgress?- 媒體加載進度事件
  • onRateChange?- 媒體播放速率變化事件
  • onSeeked?- 媒體跳轉完成事件
  • onSeeking?- 媒體跳轉開始事件
  • onStalled?- 媒體加載停滯事件
  • onSuspend?- 媒體加載暫停事件
  • onTimeUpdate?- 媒體時間更新事件
  • onVolumeChange?- 媒體音量變化事件
  • onWaiting?- 媒體等待事件

12. 其他事件

  • onToggle?-?<details>?元素的展開/折疊事件

注意事項

  1. 事件命名:React 的事件名采用駝峰命名法(如?onClick?),而不是原生的小寫形式(如?onclick?)。
  2. 事件池:React 的合成事件會被池化以提高性能,因此事件對象會在回調執行后被清空。如果需要異步訪問事件屬性,需調用?event.persist()?。在React 17+中,已不需要event.persist(),因為已優化了事件池
  3. 兼容性:合成事件的行為與原生事件一致,但屏蔽了瀏覽器差異。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/94696.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/94696.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/94696.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

從《中國開源年度報告》看中國開源力量的十年變遷中,Apache SeaTunnel 的躍遷

如果把開源世界比作一條奔涌的大河&#xff0c;過去十年里&#xff0c;中國開發者已經從“岸邊試水”變成了“中流擊水”。在最近落下帷幕的 Community Over Code Asia 2025&#xff0c;華東師范大學教授王偉老師基于《中國開源年度報告》進行的一場分享&#xff0c;用一組數字…

JAVA 程序員cursor 和idea 結合編程

cursor 是基于vscode改良而來的&#xff0c;外加上Claude大語言模型而產生的AI編輯器&#xff0c;市面上也有阿里的靈碼qianwen3-coder大語言模型。我個人電腦還是喜歡用idea集成靈碼插件開發。但是也稍微介紹下習慣idea的人只是使用cursor代碼生成的話&#xff0c;這有個小妙招…

查看部署在K8S服務的資源使用情況

要查看 Pod中 server 的資源使用情況&#xff08;CPU 和內存&#xff09;&#xff0c;你需要使用 Kubernetes 的監控工具。最常用的是 kubectl top 命令。? 方法一&#xff1a;使用 kubectl top&#xff08;推薦&#xff09; 1. 查看 Pod 的 CPU 和內存使用 kubectl top pod s…

uni-app vue3 小程序接入 aliyun-rtc-wx-sdk

安裝依賴&#xff1a; npm install aliyun-rtc-wx-sdk crypto-jsuni-app&#xff0c;新建一個頁面&#xff0c;粘貼以下代碼 在阿里云實時音視頻補充appId、appKey即可&#xff0c; <template><view class"container"><!-- 用戶輸入區域 --><vi…

Java技術棧/面試題合集(3)-Java并發篇

場景 Java入門、進階、強化、擴展、知識體系完善等知識點學習、性能優化、源碼分析專欄分享: Java入門、進階、強化、擴展、知識體系完善等知識點學習、性能優化、源碼分析專欄分享_java高級進階-CSDN博客 通過對面試題進行系統的復習可以對Java體系的知識點進行查漏補缺。…

[AI 生成] Spark 面試題

spark 基礎問題面試題以下是 Spark 基礎面試題的全面梳理&#xff0c;涵蓋核心概念、架構原理和編程模型&#xff0c;幫助快速掌握高頻考點&#xff1a;一、核心概念1. Spark 核心組件組件作用Driver執行 main() 方法&#xff0c;調度任務&#xff0c;管理集群資源Executor在 W…

MySQL的DML增刪改操作:

目錄 添加數據&#xff1a; 方式1&#xff1a;一條一條添加數據&#xff1a; 方式2&#xff1a;將查詢結果插入到表中&#xff1a; 更新數據&#xff1a; 刪除數據&#xff1a; MySQL8的新特性&#xff1a;計算列&#xff1a; 本文介紹了MySQL數據庫操作語言(DML)的基本使…

MySQL運維常用語法速查

&#x1f5c3;? 一、數據庫操作 CREATE DATABASE db_name; USE db_name; DROP DATABASE db_name; SHOW DATABASES;&#x1f517; 官方文檔 &#x1f4ca; 二、表操作 表創建示例 CREATE TABLE users (id INT AUTO_INCREMENT PRIMARY KEY,name VARCHAR(50) NOT NULL,email V…

汽車以太網通信協議——SOME/IP

1. 背景 SOME/IP是一種汽車中間件解決方案&#xff0c;其全稱是Scalable Service-Oriented Middleware over IP&#xff0c;即位于 IP 協議層以上的一種面向服務的可擴展的中間件。 中間件&#xff1a;該術語起源于復雜的軟件系統開發&#xff0c;用以實現軟件組件之間的數據交…

什么是負載均衡,有哪些常見算法?

文章目錄1.什么是負載均衡2.負載均衡的分類2.1 二層負載均衡2.2 三層負載均衡2.3 四層負載均衡2.4 七層負載均衡3.負載均衡工具3.1 LVS3.2 Nginx3.3 HAProxy4.常見負載均衡算法5.面試回答模板1.什么是負載均衡 為了提升web應用的各方面能力&#xff0c;我們一般會把多臺機器組…

PyTorch 核心三件套:Tensor、Module、Autograd

歡迎來到啾啾的博客&#x1f431;。 記錄學習點滴。分享工作思考和實用技巧&#xff0c;偶爾也分享一些雜談&#x1f4ac;。 有很多很多不足的地方&#xff0c;歡迎評論交流&#xff0c;感謝您的閱讀和評論&#x1f604;。 目錄引言1 Tensor1.1 &#x1f6e0;?Tensor 的核心用…

python源碼是如何運行起來的

為什么要了解底層原理 寫出高質量代碼 問題定位 滿足好奇心 機械通感 開始 當我們編寫并運行一行 print(Hello, World!) 時&#xff0c;背后究竟發生了什么&#xff1f;Python 代碼是如何從我們可讀的文本&#xff0c;變成計算機可以執行的指令的呢&#xff1f; 很多人將…

MacOS Docker 安裝指南

MacOS Docker 安裝指南 引言 Docker 是一個開源的應用容器引擎,它允許開發者打包他們的應用以及應用的依賴包到一個可移植的容器中,然后發布到任何流行的 Linux 機器上,也可以實現虛擬化。容器是完全使用沙箱機制,相互之間不會有任何接口(類似 iPhone 的 app)。Docker …

Cisco 3750X交換機更新到IOS 15.2后無法啟動 提示:Boot process failed...

背景及故障現象 一臺新購入的二手Cisco 3750X-48P&#xff0c;原機自帶IOS軟件版本為12.x&#xff0c;可以正常工作。 但將IOS版本升級到15.2之后&#xff0c;在啟動過程中卡住。 第一次加載IOS軟件時是正常的&#xff0c;提示&#xff1a; Loading "flash:/c3750e-uni…

Redis Redis 常見數據類型

Redis 提供了 5 種數據結構&#xff0c;理解每種數據結構的特點對于 Redis 開發運維非常重要&#xff0c;同時掌握每種數據結構的常見命令&#xff0c;會在使用 Redis 的時候做到游刃有余。 一、預備知識 官方文檔&#xff1a;Commands | Docs (redis.io) 1、最核心的兩個命令…

金融風控實戰:Spring Boot + LightGBM 貸款預測模型服務化(超詳細版)

金融風控實戰&#xff1a;Spring Boot LightGBM 貸款預測模型服務化&#xff08;超詳細版&#xff09;一、整體架構設計二、模型訓練與優化1. 特征工程&#xff08;Python&#xff09;2. 模型評估與優化三、Spring Boot 服務實現1. 項目結構2. ONNX 模型服務3. 特征工程服務4.…

前端學習 7:EDA 工具

目錄 EDA 工具 Design Ware Synopsys CoreTools 套件 VCS verdi Design Compiler EDA 工具 常用的EDA工具主要來自三家公司&#xff1a;Synopsys、Cadence和Mentor&#xff08;已被Siemens收購&#xff09;。EDA&#xff0c;全稱電子設計自動化&#xff08;Electronics …

windows有一個企業微信安裝包,腳本執行并安裝到d盤。

以下是將本地已有的企業微信安裝包安裝到D盤的完整PowerShell腳本&#xff0c;包含詳細的錯誤處理和進度反饋&#xff1a; <# .SYNOPSIS使用本地企業微信安裝包安裝到D盤 .DESCRIPTION自動檢測本地安裝包&#xff0c;靜默安裝到指定目錄支持.exe和.msi格式安裝包 #># 強制…

[LVGL] 布局系統 lv_flex, lv_grid | 輸入設備 lv_indev | union

第五章&#xff1a;布局系統&#xff08;lv_flex, lv_grid&#xff09; 歡迎回來&#xff01; 在第四章&#xff1a;樣式&#xff08;lv_style&#xff09;中&#xff0c;我們掌握了如何通過色彩、字體和圓角等特性美化部件。當界面元素具備視覺吸引力后&#xff0c;如何優雅…

Linux中的mkdir命令

基本語法mkdir 命令的基本語法如下&#xff1a;mkdir [選項] 目錄名創建單個目錄要創建一個新目錄&#xff0c;只需在 mkdir 后跟上目錄名稱。例如&#xff1a;mkdir new_folder這會在當前工作目錄下創建一個名為 new_folder 的目錄。創建多個目錄可以一次性創建多個目錄&#…