Kinrany / vue-p5

Vue component for p5.js
125 stars 16 forks source link

5 errors on console #18

Open stanleyseow opened 5 years ago

stanleyseow commented 5 years ago

I just did a very basic script and got these 5 errors below ...

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-p5@0.7.x"></script>

<div id="app">
  <vue-p5 v-on="this"></vue-p5>
</div>

<script>
new Vue({
  el: '#app',
  methods: {
    setup(sketch) {
      sketch.createCanvas(400,400);
    },
    draw(sketch) {
        sketch.background('green');
        this.currentTime = Date.now();
        sketch.text(this.currentTime,50,50);
    }
  }
});
</script>

Errors in console

vue.js:634 [Vue warn]: Invalid handler for event "$parent": got undefined

found in

---> <VueP5> at D:\Users\Ruslan\Projects\Web\vue-p5\src\p5.vue
       <Root>
warn @ vue.js:634
updateListeners @ vue.js:2209
updateComponentListeners @ vue.js:3793
initEvents @ vue.js:3763
Vue._init @ vue.js:4990
VueComponent @ vue.js:5141
createComponentInstanceForVnode @ vue.js:3290
init @ vue.js:3121
createComponent @ vue.js:5967
createElm @ vue.js:5914
createChildren @ vue.js:6042
createElm @ vue.js:5943
patch @ vue.js:6503
Vue._update @ vue.js:3940
updateComponent @ vue.js:4061
get @ vue.js:4472
Watcher @ vue.js:4461
mountComponent @ vue.js:4068
Vue.$mount @ vue.js:9038
Vue.$mount @ vue.js:11923
Vue._init @ vue.js:5006
Vue @ vue.js:5072
(anonymous) @ (index):9
vue.js:634 [Vue warn]: Invalid handler for event "_inactive": got null

found in

---> <VueP5> at D:\Users\Ruslan\Projects\Web\vue-p5\src\p5.vue
       <Root>
warn @ vue.js:634
updateListeners @ vue.js:2209
updateComponentListeners @ vue.js:3793
initEvents @ vue.js:3763
Vue._init @ vue.js:4990
VueComponent @ vue.js:5141
createComponentInstanceForVnode @ vue.js:3290
init @ vue.js:3121
createComponent @ vue.js:5967
createElm @ vue.js:5914
createChildren @ vue.js:6042
createElm @ vue.js:5943
patch @ vue.js:6503
Vue._update @ vue.js:3940
updateComponent @ vue.js:4061
get @ vue.js:4472
Watcher @ vue.js:4461
mountComponent @ vue.js:4068
Vue.$mount @ vue.js:9038
Vue.$mount @ vue.js:11923
Vue._init @ vue.js:5006
Vue @ vue.js:5072
(anonymous) @ (index):9
vue.js:634 [Vue warn]: Invalid handler for event "_vnode": got null

found in

---> <VueP5> at D:\Users\Ruslan\Projects\Web\vue-p5\src\p5.vue
       <Root>
warn @ vue.js:634
updateListeners @ vue.js:2209
updateComponentListeners @ vue.js:3793
initEvents @ vue.js:3763
Vue._init @ vue.js:4990
VueComponent @ vue.js:5141
createComponentInstanceForVnode @ vue.js:3290
init @ vue.js:3121
createComponent @ vue.js:5967
createElm @ vue.js:5914
createChildren @ vue.js:6042
createElm @ vue.js:5943
patch @ vue.js:6503
Vue._update @ vue.js:3940
updateComponent @ vue.js:4061
get @ vue.js:4472
Watcher @ vue.js:4461
mountComponent @ vue.js:4068
Vue.$mount @ vue.js:9038
Vue.$mount @ vue.js:11923
Vue._init @ vue.js:5006
Vue @ vue.js:5072
(anonymous) @ (index):9
vue.js:634 [Vue warn]: Invalid handler for event "_staticTrees": got null

found in

---> <VueP5> at D:\Users\Ruslan\Projects\Web\vue-p5\src\p5.vue
       <Root>
warn @ vue.js:634
updateListeners @ vue.js:2209
updateComponentListeners @ vue.js:3793
initEvents @ vue.js:3763
Vue._init @ vue.js:4990
VueComponent @ vue.js:5141
createComponentInstanceForVnode @ vue.js:3290
init @ vue.js:3121
createComponent @ vue.js:5967
createElm @ vue.js:5914
createChildren @ vue.js:6042
createElm @ vue.js:5943
patch @ vue.js:6503
Vue._update @ vue.js:3940
updateComponent @ vue.js:4061
get @ vue.js:4472
Watcher @ vue.js:4461
mountComponent @ vue.js:4068
Vue.$mount @ vue.js:9038
Vue.$mount @ vue.js:11923
Vue._init @ vue.js:5006
Vue @ vue.js:5072
(anonymous) @ (index):9
vue.js:634 [Vue warn]: Invalid handler for event "$vnode": got undefined

found in

---> <VueP5> at D:\Users\Ruslan\Projects\Web\vue-p5\src\p5.vue
       <Root>
Kinrany commented 5 years ago

Hi, thanks for the report!

In case you still have this problem, here's a quick fix: replace

<vue-p5 v-on="this"></vue-p5>

with

<vue-p5 v-on="{setup, draw}"></vue-p5>

I'll keep this issue open for now. I wonder how many people have already encountered this...

stanleyseow commented 5 years ago

Thanks, error fixed ...

Kinrany commented 5 years ago

I'll get around to investigating this eventually :)

Maybe I should just remove all mentions of this from README. Or make the {setup, draw} way the default and only mention this once, as a shortcut.