欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ElementUI的Table如何默认全选

程序员文章站 2022-06-15 15:52:12
ElementUI的Table如何默认全选注意!!!!!!!!!!!.[请请求拿到数据后,再调用这个方法,给table一个ref,需要用ref来调用他的方法]// An highlighted block loadListData() { // 这只是一个请求 this.searchForm["orderType"] = 2; return this.getOrderList({ ...this.searchForm, clientType: "1",...

ElementUI的Table如何默认全选

注意!!!!!!!!!!!.
[请请求拿到数据后,再调用这个方法,给table一个ref,需要用ref来调用他的方法]

// An highlighted block
  loadListData() { // 这只是一个请求
    this.searchForm["orderType"] = 2;
    return this.getOrderList({
      ...this.searchForm,
      clientType: "1",
      orderItems: this.mix_sortParams,
      pageNum: this.mix_pageNum,
      pageSize: this.mix_pageSize
    }).then(data => {
      console.log(data);
      this.orderList = data.data.list;
      this.toggleSelection(data.data.list); // 在此调用!!!!!!!
      return data;
    });
  }
// 默认全选行
  toggleSelection(orderList) {
    this.$nextTick(() => {
      const ref = this.$refs as any; // as是TS里要用的,js去掉as any 即可
      ref.table.toggleAllSelection(); // 全选
    });
  }
  // 默认指定选中行 
   toggleSelection(orderList) {
    this.$nextTick(() => {
      const ref = this.$refs as any;
       if (orderList) {
         console.log(orderList, "22222");
         orderList.forEach(row => {
           ref.table.toggleRowSelection(row, true);// 指定 第一个参数是要选中的列是个对象
                                                   //,第二个参数是true为选中 false为非选中
         });
       } else {
         ref.clearSelection(); // 清空选中项
       }
    });
  }

如果帮到了你,请点赞一下哦!我将继续帮助你们

本文地址:https://blog.csdn.net/weixin_46719255/article/details/112580453