? ?由于公司項目業務邏輯需求，需要在點擊picker后判斷數據是否為空，再決定是否打開picker；若接口響應數組為空，阻止picker打開。

? ?這里就需要用到jQuery的event.stopImmediatePropagation()?方法（執行第一個事件處理程序，并阻止剩下的事件處理程序被執行）

• 給picker外層DIV進行添加id屬性

<div id='ID'><Pickerdata={data}cols={1} {...getFieldProps('historyRecord')}onOk={this.historyRecorOkClick}><div className='selectMsgBlock'><div className='leftBlock'>{historyRecord}</div>{!isChoose? <div className='rightBlock'>選擇</div>: <div className='rightBlock' onClick={this.reSet} >清除</div>}</div></Picker> </div>

?

• 在componentDidMount中添加對DIV的點擊事件進行監聽判斷：

const historyRecordDOM = document.getElementById('ID')// 阻止事件冒泡、阻止下級元素的函數執行historyRecordDOM.addEventListener("click", (event) => {// 監聽點擊事件，對指定state值進行判斷if (this.state.data.length === 0) {Toast.fail('該通知鏈接的歷史記錄為空');event.stopImmediatePropagation();} }, false);

?

總結

以上是生活随笔為你收集整理的阻止事件冒泡 -- 在antd-mobile中，拦截点击picker后默认打开行为的全部內容，希望文章能夠幫你解決所遇到的問題。

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