不返回selected字段的全选反选

            <div class="checkbox">
              <el-checkbox v-model="checked" @change="checkAllChange"></el-checkbox>
            </div>
            <div class="read">已读</div>
            <div class="delete">删除</div>
          </div>

          <div class="table-body">
            <el-checkbox-group v-model="checkModel" @change="checkChange">
              <div class="table-body-item" :class="{'isActive': changeIndex==index}" v-for="(item, index) in newsList" :key="item.id" @click="changeIndex=index">
                <div class="checkbox">
                  <el-checkbox :label="item.id" :key="item.id"></el-checkbox>
                </div>
                <div class="status" :title=item.status>{{item.status}}</div>
                <div class="detail" @click="toDetail(item.id)"><span>{{item.detail}}</span></div>
                <div class="date">{{item.date}}</div>
              </div>
            </el-checkbox-group>
          </div>

data() {
    return {
      changeIndex: -1,
      checked: false, // 是否全选
      checkModel: [],
      newsList: [
        {
          id: 1,
          background: 0,
          status: '企业升级审批结果哈车费好几次是分局纪念册返奖率鹅夫人开吗哈哈哈哈哈',
          detail: '您的企业升级审批已通过！请点击查看详情',
          date: '2020年11月9日'
        },
        {
          id: 2,
          background: 0,
          status: '订单审批结果',
          detail: '您的订单xxxxx审批已通过！请点击查看详情',
          date: '2020年11月9日'
        },
        {
          id: 3,
          background: 0,
          status: '订单发货通知',
          detail: '您的订单xxxxx已发货！请点击查看详情',
          date: '2020年11月9日'
        },
        {
          id: 4,
          background: 0,
          status: '营销优惠活动',
          detail: '营销优惠活动xxxx火热来袭！请点击查看详情',
          date: '2020年11月9日'
        },
        {
          id: 5,
          background: 0,
          status: '企业升级审批结果哈次是分局纪念册返奖率鹅夫人开吗哈哈哈哈哈',
          detail: '您的企业升级审批已通过！请点击查看详情',
          date: '2020年11月9日'
        }
      ]
    };
  },
  methods: {
    checkChange(value) {
      // console.log(value.length, this.checkModel.length);
      if (this.checkModel.length === this.newsList.length) {
        this.checked = true;
      } else {
        this.checked = false;
      }
    },
    checkAllChange() {
      if (this.checkModel.length !== 0) {
        this.checkModel = [];
      }
      if (this.checked) {
        this.newsList.forEach((item) => {
          if (this.checkModel.indexOf(item.id) === -1) {
            this.checkModel.push(item.id);
          }
        });
      } else {
        this.checkModel = [];
      }
    },
    toDetail(id) {
      this.$router.push({
        path: '/member/detail'
      });
    }
  }

        .table-title{
          height: .54rem;
          background: #F5F5F5;
          display: flex;
          align-items: center;
          border-bottom: .01rem solid #f0f0f0;
          .read, .delete{
             62px;
            height: .30rem;
            line-height: .30rem;
            background: #fff;
            border: 1px solid #eee;
            border-radius: .08rem;
            text-align: center;
            cursor: pointer;
            color: #666;
            margin-right: .21rem;
          }
        }

        .table-body{
          background-color: #fff;
          .table-body-item{
            display: flex;
            height: .55rem;
            align-items: center;
            color: #333;
            border-bottom: .01rem solid #f0f0f0;
            .status{
               1.55rem;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
            .detail{
              margin-left: .51rem;
               7.05rem;
              span{
                cursor: pointer;
              }
            }
            .date{
              color: #999;
            }
            &:last-child{
              border-bottom: none;
            }
            &:hover{
              background-color: #f5f5f5;
            }
          }
          .isActive{
            background-color: #f5f5f5;
          }
        }