問題:下圖中@keyup.enter事件和click事件綁定了同一個方法,但是觸發兩個方法后最后的結果卻不一樣;
click觸發綁定事件能正常運行,但是@keyup.enter觸發綁定事件就是莫名其妙的結果很奇怪,明明調用的都是同一個函數
經過多次檢查輸出,發現在觸發keyup.enter事件的時候,執行到了我自定義的一個刪除函數;what???八竿子打不到邊的函數為什么會被執行,為什么會執行這個刪除函數,為什么不執行我的修改函數?
帶着滿臉問號,我去看了我這個函數的調用的地方,就是下面的代碼調用的,沒毛病,就一個普通的button調用的
然后結合了各路神仙的經驗發現,就是@keyup.enter的問題:
1. @keyup.enter的觸發會觸發form表單的提交,觸發當前form表單中button按鈕上的事件
測試發現:
1. 當前form表單里面有多個button,只會自動觸發第一個button
2. 對form外面的button沒有影響
解決:
1. 給button標簽加上type=‘button’
2.使用elment ui的button組件 ‘el-button’