Vue復選框子級和父級

所以我正在制作復選框組，如果選中父復選框，則所有子復選框都將被選中。如果選中子復選框，則將選中父復選框等

Vue 模板代碼片段

            <div class="row">
            <div class="col-12">
                            <b-tabs content-class="mt-2" @click="myId(value.parentId)">
                                <div v-for="title in testpTitle" :key="title.id">
                                    <b-tab :title="title.name">
                                        <div class="md-tab-content">
                                            <div v-for="value in testp" :key="value.id">
                                                <div class="form-check" v-if="value.parentId !== 0 && 
                                                //value.parentId == title.id &&
                                                 value.parentId != 62">
                                                    <input class="form-check-input" @click="checkIfItHasChildren(value.id)"
                                                        :id="value.id"
                                                        type="checkbox"
                                                        :value="value.id"
                                                        :disabled="value.isDisabled"
                                                        v-model="value.isChecked"

                                                    />{{value.name   "  "   value.id   "   "   value.parentId}} 

                                                </div> 
                                            </div>
                                        </div>
                                    </b-tab>
                                </div>

                            </b-tabs>
                <div class="float-right">
                    <button type="button" class="btn btn-success" @click="saveData()">SAVE</button>
                    <button type="button" class="btn btn-danger" @click="returnToRoles()">CANCEL</button>
                </div>
            </div>

ts中的腳本檔案

<script lang="ts">
        @Component({
        components: {
        }
    })

    export default class RolePermission extends Vue { 
        
        testp: PermissionModel[] = [];
        testpTitle: PermissionModel[] = [];

        $refs!: {
            rolePermissionList: DataTable
            permissionList: DataTable
        };

        async mounted(){
            this.dashboard = await permissionService.getDashboard();

        }

        checkIfItHasChildren(id){
            let i = 0;
            var array = this.testp;

            array.forEach(element => {
                if(element.parentId == id)
                    {
                        array[i].isChecked = element[id].isChecked;
                    }
                i  ;
            });
        }
    async clicked(id) {
        this.openedDatatable=1;

        this.testp = await permissionService.getPermissions(id););
        this.testpTitle = await permissionService.getPermissionsTitle();
        }

`

這是一張圖片的鏈接。在圖片中有復選框串列及其名稱、id 和 parentId [在此處輸入影像描述][1] [1]：https://i.stack.imgur.com/weMNu.png

我收到此錯誤 vue.esm.js?a0??26:628 [Vue 警告]：v-on 處理程式中的錯誤：“TypeError：無法讀取未定義的屬性（讀取'isChecked'）”

和

TypeError：無法讀取未定義的屬性（讀取“isChecked”）

uj5u.com熱心網友回復：

使用element.isChecked;而不是element[id].isChecked;修復錯誤

TypeError：無法讀取未定義的屬性（讀取“isChecked”）

標籤：。网 打字稿 Vue.js 复选框

上一篇：如何在應用程式中顯示cmd的輸出？

下一篇：如何在Lambda運算式中檢查null以列出？