search

luiguild / v-bar

The virtual responsive crossbrowser scrollbar component for VueJS 2x
MIT License
222 stars 28 forks source link

[Vue warn]: Error in destroyed hook after switching page with vue router #5

Closed sredbull closed 7 years ago

sredbull commented 7 years ago

TypeError: Cannot read property '__resizeListeners__' of undefined at removeResizeListener (eval at <anonymous> (app.js:1087), <anonymous>:154:12) at VueComponent.destroyed (eval at <anonymous> (app.js:919), <anonymous>:40:99) at callHook (eval at <anonymous> (app.js:721), <anonymous>:2274:21) at VueComponent.Vue.$destroy (eval at <anonymous> (app.js:721), <anonymous>:2096:5) at pruneCacheEntry (eval at <anonymous> (app.js:721), <anonymous>:4057:29) at VueComponent.destroyed (eval at <anonymous> (app.js:721), <anonymous>:4078:7) at callHook (eval at <anonymous> (app.js:721), <anonymous>:2274:21) at VueComponent.Vue.$destroy (eval at <anonymous> (app.js:721), <anonymous>:2096:5) at destroy (eval at <anonymous> (app.js:721), <anonymous>:2963:33) at invokeDestroyHook (eval at <anonymous> (app.js:721), <anonymous>:4778:59)

this looks simular: link

luiguild commented 7 years ago

Hi @swerrie! I use VBar and Vue-Router in one project with no problems, but I will investigated this and try to reproduce. I will get back to you soon. Thanks!

breadlesscode commented 7 years ago

Same here.

Laravel Mix V8.8 (webpack) Vue V2.0.1 Vuex V2.1.1 Vue Router V2.1.1

DarinLevesque commented 7 years ago

Yeah, me too. Same versions as above, without Laravel.

luiguild commented 7 years ago

Actually I have one project running perfectly with vue ^2.1.0 vue-router ^2.1.1 webpack ^1.13.2

I created a new project using vue-cli template and I cannot reproduce this error...

VBar already have many remove listeners:

beforeDestroy () {
        document.removeEventListener('mousemove', this.onDrag)
        document.removeEventListener('touchmove', this.onDrag)
        document.removeEventListener('mouseup', this.stopDrag)
        document.removeEventListener('touchend', this.stopDrag)
},
destroyed () {
    removeResizeListener(this.$refs.container, this.resize)
    removeResizeListener(this.$refs.wrapperRef.children[0], this.resize)
},

Someone can help me with this?

antshil commented 7 years ago

Hello! I have same issue. If move

removeResizeListener(this.$refs.container, this.resize)
removeResizeListener(this.$refs.wrapperRef.children[0], this.resize)

from destroyed() to beforeDestroy (), bug will be fixed. Why "removeResizeListener" was placed in destroyed? Is there any reason for this?

How to reproduce Use element with <v-bar> in <component> and switch component.

luiguild commented 7 years ago

Hi @antshil! Thank you for help me with this, I will push these changes today!

antshil commented 7 years ago

Thank you for the new version!