鍍金池/ 問答/HTML/ 請問如何獲得element-ui表格中的勾選項index,以實現(xiàn)批量刪除功能。

請問如何獲得element-ui表格中的勾選項index,以實現(xiàn)批量刪除功能。

用element-ui做一個后臺管理系統(tǒng),

clipboard.png
刪除單條筆記功能已經(jīng)實現(xiàn),代碼如下

clipboard.png

clipboard.png
先獲取筆記信息
運用that.id = this.tableData3[index].id;方法獲取當前選中的文章id,將id傳入請求即可刪除當前選中筆記

clipboard.png
現(xiàn)在想實現(xiàn)批量刪除功能,就是選擇幾條刪幾條,請問應(yīng)該如何獲取到勾選項的index,并將它們累加起來。

clipboard.png
選中的方法如下

clipboard.png
運用elementUI內(nèi)置方法,能實現(xiàn)單選全選,反選功能

回答
編輯回答
不討喜

this.multipleSelection 存放的就是你目前選中的所有項。

// 點擊刪除全部時
this.multipleSelection.forEach(selectedItem => {
    // 刪除請求
    axios({
        url: '/xxxxxxx/delete/' + selectedItem.id,
        method: 'get',
        dataType: 'json'
    })
})

PS: 上述已經(jīng)能夠處理批量刪除請求了,不過需要執(zhí)行批量全部成功刪除的回調(diào)的話,要么用axios.all,要么用Promise.all,原理都差不多

2017年6月15日 09:31
編輯回答
薔薇花

文檔不是有寫嗎select事件....文檔位置
一開始定義一個需要刪除的數(shù)組,在每次勾選的時候存入數(shù)組,批量刪除按鈕點擊時,刪除數(shù)組里的元素就完了撒....
框架不可能所有情況都給你考慮進去了,變通一下就實現(xiàn)了嘛.....

2017年12月31日 14:04