I am currently building a State Manager, which can be integrated into multiple Frontend Framework, including Vue. To demonstrate the usage of the State Manger in Vue, I created a simple codesandbox. Because it is always nice to have a live code example, which can be promoted in the Readme. But somehow, I am always getting this (see below) error in the codesandbox.
[Vue warn]: Property or method "children" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
The above error only occurs in the codesandbox showing the editor + preview.
Locally or in a separate tab (which displays only the preview)
it works as expected (without error).
Codesandbox (Error):
https://codesandbox.io/s/agilets-first-state-i5xxs?file=/src/main.js
Codesandbox Preview on separate tap (no Error):
https://i5xxs.csb.app/
Local Project (no Error):
https://github.com/agile-ts/agile/tree/master/examples/vue/develop/my-project
I have no idea what I am doing wrong. But it has something to do with my State Manager, since the default vue codesandbox works fine.
Advertisement
Answer
Ignore that error. This is a bug in Codesandbox and not directly caused by your own code. One of their developers commented on Apr 13 that the issue is low priority, so it likely won’t be fixed anytime soon.