通过vue apollo mutate添加新节点时，V-Treeview不显示新的子节点

Question

在我的vue应用程序中，我有以下v-treeview代码，其中显示了对象的项目：

<v-treeview
                :active.sync="active"
                :items="items"
                :open.sync="open"
                activatable
                open-on-click
                item-key="name"
                :search="search"
                return-object
                >
                    <template v-slot:append="{ item }">
                        <v-btn icon color="primary" small v-if="item" @click="openChildDialog(item)">
                            <v-icon small> mdi-folder-plus </v-icon>
                        </v-btn>

                        
                    </template>
                </v-treeview>

openChildDialog 方法是在我的脚本中定义的：

openChildDialog(parent){
            this.dialogAddChild = true
            this.parentPath = this.selectedParent
        }

现在，当对话框打开时，它包含一个用于输入孩子名称的文本字段，然后单击保存按钮，保存按钮将调用保存操作使用apollo mutate创建新的子节点，然后使用新的子节点更新apollo缓存。但是，UI不会显示新的子节点。 这是对话框和保存操作的代码

<v-dialog v-model="dialogAddChild" max-width="500px">
                    <v-form ref="addChildForm" v-model="isValid">
                        <v-card>
                            <v-card-title>
                                <span class="headline">Add child</span>
                            </v-card-title>

                            <v-card-text>
                                <v-container>
                                    <v-row>
                                        <v-col>
                                            <v-text-field 
                                            v-model="editedChildName" 
                                            label="Child Name"
                                            :rules="NameRule"
                                            required>
                                            </v-text-field>
                                        </v-col>
                                    </v-row>

                                    <v-row>
                                        <v-col v-if="editedChildName.length >0">
                                            <v-text-field  
                                            v-model="editedChildPath" 
                                            label="Child Path"
                                            v-text="editedChildPath = parentPath + '/' + editedChildName"
                                            >
                                            </v-text-field>
                                        </v-col>
                                    </v-row>
                                </v-container>
                            </v-card-text>

                            <v-card-actions>
                                <v-btn color="blue darken-1" text @click="close">Cancel</v-btn>
                                <v-spacer></v-spacer>
                                <v-btn color="blue darken-1" text @click="postNewChild" :disabled="!isValid">Save</v-btn>
                            </v-card-actions>
                        </v-card>
                    </v-form>
                </v-dialog>

postNewChild(){
            const newChild = {}
            
            newChild.name = this.editedChildName
            newChild.path = this.editedChildPath
                       
            if (this.editedIndex === -1) {            
                this.$apollo.mutate({
                    //Query
                    mutation: CREATE_CHILD,
                    variables:{
                        category: newChild 
                    },
                
                    // Update the cache with the result
                    update: (store, {data: { createdChild } }) => {
                        try{
                            const query = {
                                query: GET_CATEGORIES_FOR_DOMAIN,
                                variables:
                                    {
                                        id: this.selectedDomain,
                                    },
                            }

                            //Read the query from cache
                            const data = store.readQuery({query: query.query, variables: query.variables})
                           
                            const parent = data.domain.categories.items.find(c => c.path === createdChild.path.slice(0, -createdChild.name.length-1))
                            
                            if(parent !== undefined && parent.children !== undefined){
                                parent.children.push(createdChild)
                            }
                            else if(parent !== undefined && parent.children === undefined){
                                parent.children = []
                                parent.children.push(createdChild)
                            }
                            else{
                                data.domain.categories.items.push(createdChild)
                            }
                            store.writeQuery({query: query.query, variables: query.variables, data})
                            this.skipQuery = true
                            
                        }
                        catch(error){
                            console.log(error)
                        }
                        
                    },
                
                }).then((data)=>{

                }).catch((error)=>{
                    //Error log to the console
                    //TODO: where to log the errors
                    console.log(error)
                    // We restore the initial user input
                })
            }
            else{
                //need to come up with patch graphql query
            }

            this.close()
        }
    }

数据如下：

{
    "data": {
        "domains": {
            "items": [{
                "id": "3a69b502-cf2f-4081-2a60-08d80969933d",
                "name": "TestDomain",
                "categories": {
                    "items": [{
                        "id": "b38a03fb-7dcc-4544-bf63-08d81c7a31e0",
                        "name": "test",
                        "path": "TestDomain/test",
                        "children": [{
                            "id": "afdef438-e69b-40c6-54e2-08d822ace809",
                            "name": "test1",
                            "path": "TestDomain/test/test1"
                        }]
                    }]
                }
            }]
        }
    }
}