1.click事件寫法

寫法一：

//事件add = ()=>{console.log("最近我的公孫離被吊打")} //正確使用<div onClick={ ()=>{ this.add() } }> 抓娃娃 </div>或<div onClick={ this.add }> +100 </div >

寫法二：

//事件 reduce(){console.log("最近我的公孫離被吊打") } //正確使用 <div onClick={ ()=>{ this.reduce() } }> 扔娃娃</div> 只能這樣寫，切記切記。//錯誤使用，感受痛苦吧（this is undefined） <div onClick={ this.reduce }> -100 </div > 這個是錯的，是錯的，是錯的

2.click事件寫法（獲取事件對象e）

寫法一：

//事件 reduce(e){console.log(e) } //使用 <div onClick={ (e)=>{ this.reduce(e) } }> 扔娃娃 </div>//錯誤使用，感受痛苦吧（報錯） <div onClick={ ()=>{ this.reduce() } }>抓娃娃</div>

寫法二：

//事件add = (e)=>{console.log(e)} //正確使用 <div onClick={ this.add }> +100 </div > 或 <div onClick={ (e)=>{ this.add(e) } }>抓娃娃</div> //錯誤使用，感受痛苦吧（e is undefined） <div onClick={ ()=>{ this.add() } }>抓娃娃</div> 或 <div onClick={ this.add(e) }> +100 </div >

1.click事件寫法（傳參）

寫法一：

//事件 reduce(val){console.log(val) } //使用 <div onClick={()=>{this.reduce("你好")}}>扔娃娃</div>//錯誤使用，感受痛苦吧 <div onClick={ this.reduce("你好") } }>扔娃娃</div> //瘋狂自動執行，然后報錯

寫法二：

//事件add = (val)=>{console.log(val)} //正確使用 <div onClick={ ()=>{ this.add("你好") } }> 抓娃娃 </div> //錯誤使用，感受痛苦吧 <div onClick={ this.add("你好") }> +100 </div > //自動執行1001次

3.click事件寫法（獲取事件對象e + 傳參）

寫法一：

//事件 reduce(e,hi){console.log(e,hi)} //使用 <div onClick={(e)=>{this.reduce(e,"你好")}}>扔娃娃</div>

寫法二：

//事件add = (e,hi)=>{console.log(e,hi)} //正確使用 <div onClick={(e)=>{this.add(e,"你好")}}>抓娃娃</div>

總結

以上是生活随笔為你收集整理的ant design pro中click事件传参正确写法（获取事件对象e）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。