element-ui中多选表格，配合分页的情况实现数据回显打勾。

---

element-ui中多选表格，配合分页的情况实现数据回显打勾。很常见的需求，element-ui官方实际上也给出了解决方案：

官方的解决方案

实际上我们就可以用reserve-selection与row-key结合的方式来实现这个需求。

---

实现

在上指定row-key，并在添加属性:reserve-selection为true，即可实现回显.
hasSelected即为所有选择的rows的id数组.

关键代码如下：

  data() {
    return {
      hasSelected:[],
      getRowKeys(row) {
        return row.id;
      },
    };
  },
  methods: {
    handleSelectionChange(rows) {
      this.hasSelected = [];
      if (rows) {
          rows.forEach(row => {
              if (row) {
                  this.hasSelected.push(row.id);
              }
          });
      }
      console.log(this.hasSelected);
    },
  },