el-tree组件自定义复选框实现反选效果

Question

<el-button @click="handleSelectInvert">反选</el-button>
<el-tree
                node-key="id"
                ref="tree"
                class="data-tree"
                :data="treeData"
                :props="defaultProps"
                :highlight-current="true"
                :default-expanded-keys="expandedKeys"
                @node-click="handleNodeClick"
              >
                <span class="custom-tree-node flex-space-between" slot-scope="{ node, data }">
                  <div
                    class="node-info flex-space-between first"
                    :class="{ catalogStyle: node.level == '1'}"
                  >
                    <span>{{ data.name }}</span>
                    <div class="check-box">
                      <el-checkbox v-model="data.scanCheck"></el-checkbox>
                      <el-checkbox v-model="data.downloadCheck"></el-checkbox>
                    </div>
                  </div>
                </span>
              </el-tree>

通过点击按钮实现第一个复选框的反选，如果父节点下面有多个子节点，那么显示的效果应该是父节点应该没选中的，子节点被选中的效果