Problems with the use of el-tree and el-checkbox

            <template >
                <el-card class="box-card">
                    <el-tree
                        :data="getPermissionData"
                        show-checkbox
                        ref="tree"
                        node-key="id"
                        default-expand-all
                        :default-checked-keys="selectedKeyList"
                        :expand-on-click-node="false">
                        <span class="custom-tree-node" slot-scope="{ node, data }">
                            <span>{{ node.label }}</span>
                            <span>
                                <el-checkbox-group>
                                    <el-checkbox v-model="data.isRead" label="" name="type" @click="() => append(data)"></el-checkbox>
                                    <el-checkbox v-model="data.isAdmin" label="" name="type" @click="() => remove(node, data)"></el-checkbox>
                                </el-checkbox-group>
                            </span>
                        </span>
                    </el-tree>
                </el-card>
            </template>
            

how does el-checkbox need to be bound in both directions? IsRead and isAdmin did not work.

permissions: [
    {
        id: 0,
        label: "",
        type: "SERVER",
        isRead: false,
        isAdmin: true
    },
    {
        id: 1,
        label: "",
        type: "STATION",
        isRead: false,
        isAdmin: true
    },
    {
        id: 2,
        label: "",
        type: "USER",
        isRead: false,
        isAdmin: true
    }
],
Mar.14,2022

remove el-checkbox-group

<span class="custom-tree-node" slot-scope="{ node, data }">
    <span>{{ node.label }}</span>
    <span>
        <el-checkbox v-model="data.isRead" label="" name="type"></el-checkbox>
        <el-checkbox v-model="data.isAdmin" label="" name="type"></el-checkbox>
    </span>
</span>

                    <el-tree
                        :data="getPermissionData"
                        show-checkbox
                        ref="tree"
                        node-key="id"
                        default-expand-all
                        :default-checked-keys="selectedKeyList"
                        :expand-on-click-node="false"
                        @check="selectObject">
                        <span class="custom-tree-node" slot-scope="{ node, data }">
                            <span>{{ node.label }}</span>
                            <span>
                                <el-checkbox-group v-model="data.checked" @change="selectRight(node, data)">
                                    <el-checkbox v-for="right in data.rights" :label="right" :key="right">{{right}}</el-checkbox>
                                </el-checkbox-group>
                            </span>
                        </span>
                    </el-tree>
Menu