鍍金池/ 問(wèn)答/HTML/ element如何在分頁(yè)的時(shí)候也能保存用戶的全選或者反選的操作

element如何在分頁(yè)的時(shí)候也能保存用戶的全選或者反選的操作

圖片描述

用戶點(diǎn)擊下一頁(yè)的時(shí)候,這個(gè)頁(yè)面的全選按鈕就變成了未選中,我在data中設(shè)置了一個(gè)selectAll,來(lái)保存用戶操作的數(shù)據(jù),但是沒(méi)有選中的狀態(tài)。
請(qǐng)大家給一個(gè)思路

回答
編輯回答
夢(mèng)一場(chǎng)

1.創(chuàng)建一個(gè)對(duì)象用來(lái)保存每個(gè)分頁(yè)的信息,例如

checkedObj: {
    1: [0, 1],
    2: [2, 3]
}

2.監(jiān)聽(tīng)table的selectselect-all事件,實(shí)時(shí)更新checkedObj的數(shù)據(jù)
3.監(jiān)聽(tīng)pagination的分頁(yè)切換事件,從checkedObj里面讀取數(shù)據(jù)使用toggleRowSelectionAPI還原現(xiàn)場(chǎng)
ps:存儲(chǔ)結(jié)構(gòu)你怎么喜歡怎么來(lái)

2018年1月19日 20:33
編輯回答
陌顏

element-ui有這個(gè)功能,建議看一下表格屬性row-key

2017年5月25日 03:38
編輯回答
未命名

在用戶點(diǎn)擊下一頁(yè)的時(shí)候頁(yè)面展示的就是不同的數(shù)據(jù),理應(yīng)不選中

2017年2月19日 15:52
編輯回答
厭遇

看看這個(gè),應(yīng)該能滿足你的需求:
https://segmentfault.com/q/10...

2018年8月4日 15:29
編輯回答
檸檬藍(lán)

簡(jiǎn)單來(lái)說(shuō),就是用變量來(lái)緩存每一頁(yè)的勾選信息,例如:

    data () {
        return {
            checkStatus: {
                page1: [    // 第一頁(yè)
                    {
                        checked: 1    // 第一項(xiàng)選中
                    },
                    {
                        checked: 1    // 第二項(xiàng)選中
                    },
                    {
                        checked: 0    // 第三項(xiàng)未選中
                    }
                ],
                page2: [    // 第二頁(yè)
                    {
                        checked: 0    // 第一項(xiàng)未選中
                    },
                    {
                        checked: 1    // 第二項(xiàng)選中
                    },
                    {
                        checked: 0    // 第三項(xiàng)未選中
                    }
                ]
                ...
            }
        }
    }

頁(yè)碼每次改變的時(shí)候,到這個(gè)變量里找有沒(méi)有緩存改變后那一頁(yè)的狀態(tài),如果沒(méi)有,就不管,此時(shí)默認(rèn)全部未選中。如果有記錄,就拿出來(lái)遍歷修改狀態(tài)即可。

2017年9月3日 19:32