Unhandled error on update nodes
padoauk opened this issue · 1 comments
padoauk commented
Hi.
I appreciate vue3-treeview. In a project I met an issue of "[Vue warn]: Unhandled error during execution of scheduler flush ..." in running vue3-treeview. I want to have a way to resolve this. Any idea ?
Following is the code. when loadNodes() invoked for the first time. there's no error. But for the second time and after, the error occurs.
vue is 3.2.45 vue3-treeview is 0.4.1.
<template>
<v-btn @click="loadNodes"></v-btn>
<TreeView
:nodes="nodes0"
:config="config0"
>
</TreeView>
</template>
<script setup>
import { ref } from "vue"
import { default as TreeView } from "vue3-treeview"
const nodes0 = ref({});
const config0 = ref({
roots: [],
padding: 15,
editable: true,
checkboxes: true
});
const loadNodes = () => {
fetch("http://localhost:3000", { method: 'GET' }).then((response) => {
const treenodes = genTreeNodes(response);
const rootname = getRootName(response);
nodes0.value = treenodes;
config0.value.roots = [rootname];
});
};
</script>
and runtime error.
[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core
at <Anonymous key="project01/.git" node=
Object { children: [], text: ".git", id: "project01/.git", parent: "project01" }
depth=1 ... >
at <AsyncComponentWrapper key="project01/.git" node=
Object { children: [], text: ".git", id: "project01/.git", parent: "project01" }
depth=1 ... >
at <Anonymous key=0 parent-id="project01" depth=1 ... >
at <AsyncComponentWrapper key=0 parent-id="project01" depth=1 ... >
at <BaseTransition appear=false persisted=false mode=undefined ... >
at <Transition name="level" >
at <Anonymous key="project01" node=
Object { children: (7) […], text: "project01", state: {…}, id: "project01", parent: null }
depth=0 ... >
at <AsyncComponentWrapper key="project01" node=
Object { children: (7) […], text: "project01", state: {…}, id: "project01", parent: null }
depth=0 ... >
at <Anonymous depth=0 parent-id=null onNodeOpened=fn ... >
at <Anonymous nodes=
Object { project01: {…}, "project01/.git": {…}, "project01/.gitignore": {…}, "project01/package.json": {…}, "project01/src": {…}, "project01/src/app.js": {…}, "project01/src/entry.py": {…}, "project01/src/entry.py~": {…}, "project01/src/entry2.py": {…}, "project01/src/lib": {…}, … }
config=
Object { roots: (1) […], padding: 15, editable: true, checkboxes: true }
onNodeOpened=fn ... >
at <FileManager base-url="http://localhost:3000/" root-path="project01" onOpenfile=fn<openfile> >
at <App> runtime-core.esm-bundler.js:40:16
Uncaught (in promise) TypeError: node.value.state is undefined
editable vue3-treeview.es.js:1212
run reactivity.esm-bundler.js:190
get value reactivity.esm-bundler.js:1171
editing vue3-treeview.es.js:1215
run reactivity.esm-bundler.js:190
get value reactivity.esm-bundler.js:1171
getter runtime-core.esm-bundler.js:1711
run reactivity.esm-bundler.js:190
job runtime-core.esm-bundler.js:1801
flushPreFlushCbs runtime-core.esm-bundler.js:336
vue3-treeview.es.js:1212:4
flushJobs runtime-core.esm-bundler.js:419
(Async: promise callback)
queueFlush runtime-core.esm-bundler.js:298
queueJob runtime-core.esm-bundler.js:292
effect runtime-core.esm-bundler.js:5761
triggerEffect reactivity.esm-bundler.js:400
triggerEffects reactivity.esm-bundler.js:390
triggerRefValue reactivity.esm-bundler.js:1021
set value reactivity.esm-bundler.js:1066
fetchGlobb FileManager.vue:145
(Async: promise callback)
fetchGlobb FileManager.vue:141
(Async: promise callback)
fetchGlobb FileManager.vue:137
patchStopImmediatePropagation runtime-dom.esm-bundler.js:358
callWithErrorHandling runtime-core.esm-bundler.js:173
callWithAsyncErrorHandling runtime-core.esm-bundler.js:182
callWithAsyncErrorHandling runtime-core.esm-bundler.js:192
invoker runtime-dom.esm-bundler.js:345
(Async: EventListener.handleEvent)
addEventListener runtime-dom.esm-bundler.js:279
patchEvent runtime-dom.esm-bundler.js:297
patchProp runtime-dom.esm-bundler.js:376
mountElement runtime-core.esm-bundler.js:5224
processElement runtime-core.esm-bundler.js:5196
patch runtime-core.esm-bundler.js:5116
componentUpdateFn runtime-core.esm-bundler.js:5656
run reactivity.esm-bundler.js:190
update runtime-core.esm-bundler.js:5763
setupRenderEffect runtime-core.esm-bundler.js:5777
mountComponent runtime-core.esm-bundler.js:5559
processComponent runtime-core.esm-bundler.js:5517
patch runtime-core.esm-bundler.js:5119
mountChildren runtime-core.esm-bundler.js:5303
mountElement runtime-core.esm-bundler.js:5213
processElement runtime-core.esm-bundler.js:5196
patch runtime-core.esm-bundler.js:5116
mountChildren runtime-core.esm-bundler.js:5303
mountElement runtime-core.esm-bundler.js:5213
processElement runtime-core.esm-bundler.js:5196
patch runtime-core.esm-bundler.js:5116
componentUpdateFn runtime-core.esm-bundler.js:5656
run reactivity.esm-bundler.js:190
update runtime-core.esm-bundler.js:5763
setupRenderEffect runtime-core.esm-bundler.js:5777
mountComponent runtime-core.esm-bundler.js:5559
processComponent runtime-core.esm-bundler.js:5517
patch runtime-core.esm-bundler.js:5119
mountChildren runtime-core.esm-bundler.js:5303
mountElement runtime-core.esm-bundler.js:5213
processElement runtime-core.esm-bundler.js:5196
patch runtime-core.esm-bundler.js:5116
componentUpdateFn runtime-core.esm-bundler.js:5656
run reactivity.esm-bundler.js:190
update runtime-core.esm-bundler.js:5763
setupRenderEffect runtime-core.esm-bundler.js:5777
mountComponent runtime-core.esm-bundler.js:5559
processComponent runtime-core.esm-bundler.js:5517
patch runtime-core.esm-bundler.js:5119
render2 runtime-core.esm-bundler.js:6278
mount runtime-core.esm-bundler.js:4474
mount runtime-dom.esm-bundler.js:1607
<anonymous> main.js:17
N00ts commented
Can you provide an exemple using a sanbox instead of copy / paste your code ? It is easier to post a codesandbox / repo that repropduce the issue.
Regards