1. 程式人生 > >vue 表格數據編輯,點擊取消或者完成按鈕後,關閉編輯狀態沒有及時生效

vue 表格數據編輯,點擊取消或者完成按鈕後,關閉編輯狀態沒有及時生效

分享 inf bsp 狀態 修改 點擊 視圖 進行 解決

點擊編輯按鈕:

技術分享圖片

編輯狀態下,表格可以編輯。但是點擊“確認”或者“取消”按鈕,列數據編輯狀態已經修改,但是視圖沒有改變。

技術分享圖片

頁面代碼:

獲取當前行的index,並直接修改當前行用於判斷是否編輯狀態的數據為false(不可編輯);

技術分享圖片

根本原因是因為vue的視圖更新不及時問題導致。

解決方法:

需要使用vue.set()方法進行修改數據才可以立刻更新視圖

技術分享圖片

vue 表格數據編輯,點擊取消或者完成按鈕後,關閉編輯狀態沒有及時生效