背景：看板里的卡片窖壕，要做卡片編輯，編輯標(biāo)題時(shí)，點(diǎn)擊input輸入框瞻讽，會(huì)觸發(fā)draggable的choose事件鸳吸，導(dǎo)致input輸入框無法聚焦
代碼結(jié)構(gòu)：
@choose="onChoose"
>
<CardItem>
<el-input
v-model="systemTitle"
type="textarea"
:rows="2"
@click.stop.native
/>
</CardItem>
</draggable>
百度el-input的阻止事件冒泡，添加了
@click.stop.native
在線運(yùn)行例子速勇，代碼如下晌砾，發(fā)現(xiàn)確實(shí)可以阻止事件冒泡，但是在項(xiàng)目代碼draggable里面運(yùn)行發(fā)現(xiàn)阻止不了烦磁。
<el-input
type="textarea"
:rows="2"
placeholder="請(qǐng)輸入內(nèi)容"
@click.stop.native
v-model="textarea">
</el-input>
{{text}}
</div>
最后查看dragaable源碼里發(fā)現(xiàn)對(duì)于事件的監(jiān)聽不是click事件养匈，而是如下三個(gè)：
supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && !Safari
if (options.supportPointer) {
on(el, 'pointerdown', this._onTapStart);
} else {
on(el, 'mousedown', this._onTapStart);
on(el, 'touchstart', this._onTapStart);
}
所以要在pc上添加@pointerdown.stop.native
鏈接：
https://developer.mozilla.org/zh-CN/docs/Web/API/EventTarget/addEventListener
https://www.w3cschool.cn/fetch_api/fetch_api-ipav2pzn.html
