Element: select组件被destroy时出现TypeError: Cannot read property '__resizeListeners__' of undefined

Created on 27 Mar 2017  ·  34Comments  ·  Source: ElemeFE/element

Element UI version

1.2.5

OS/Browsers version

chrome 57

Vue version

2.2.6

Reproduction Link

Steps to reproduce

子页面使用el-select后,切换到其他子页面,在执行destory时出现如题JS error。
vue.runtime.esm.js:554 [Vue warn]: Error in destroyed hook:
(found in )
vue.runtime.esm.js:1443 TypeError: Cannot read property '__resizeListeners__' of undefined
at removeResizeListener (resize-event.js:183)
at VueComponent.destroyed (scrollbar.js:245)
at callHook (vue.runtime.esm.js:2269)
at VueComponent.Vue.$destroy (vue.runtime.esm.js:2091)
at destroy (vue.runtime.esm.js:2958)
at invokeDestroyHook (vue.runtime.esm.js:4773)
at invokeDestroyHook (vue.runtime.esm.js:4778)
at VueComponent.patch [as __patch__] (vue.runtime.esm.js:5039)
at VueComponent.Vue.$destroy (vue.runtime.esm.js:2089)
at destroy (vue.runtime.esm.js:2958)

What is Expected?

没有JS Error

What is actually happening?

出现描述中的error

bug

Most helpful comment

v1.2.7 has been released.

All 34 comments

我也出现同样的问题,select销毁是报同样的错。

+1

jsfiddle示例

这个示例下面el-select隐藏的时候就会报错。
我已经测试过,vue2.2.6才会报错,2.2.5以下没有这个错误。

+1,在被销毁时产生了警告

[Vue warn]: Error in destroyed hook:
(found in )
warn @ vue.common.js?e881:560
handleError @ vue.common.js?e881:1445
callHook @ vue.common.js?e881:2277
Vue.$destroy @ vue.common.js?e881:2097
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
invokeDestroyHook @ vue.common.js?e881:4779
invokeDestroyHook @ vue.common.js?e881:4784
patch @ vue.common.js?e881:5045
Vue.$destroy @ vue.common.js?e881:2095
destroy @ vue.common.js?e881:2964
(anonymous) @ vue.common.js?e881:3246
invokeDestroyHook @ vue.common.js?e881:4779
removeVnodes @ vue.common.js?e881:4795
updateChildren @ vue.common.js?e881:4902
patchVnode @ vue.common.js?e881:4936
patch @ vue.common.js?e881:5060
Vue._update @ vue.common.js?e881:2042
updateComponent @ vue.common.js?e881:2158
get @ vue.common.js?e881:2469
run @ vue.common.js?e881:2539
flushSchedulerQueue @ vue.common.js?e881:2331
(anonymous) @ vue.common.js?e881:507
nextTickHandler @ vue.common.js?e881:456
vue.common.js?e881:1449 TypeError: Cannot read property '__resizeListeners__' of undefined

+1,同样遇到这个问题.看了半天以为代码哪里没写对,上来一看才发现这是个BUG啊,哈哈.

这个问题还是存在的啊·@Leopoldthecoder

全部更新了一遍,问题依旧
"dependencies": { "element-ui": "^1.2.6", "vue": "^2.2.6", "vue-router": "^2.2.0" }

This problem still exists for me too (tried to reinstall all npm packages, etc)

抱歉,只修了 Select,没修 Scrollbar。暂时先降级 Vue 吧。

@Leopoldthecoder 预计下一版什么时候发布。 vue2.2.5 跟 vue-router 还有内存泄露的情况。

vue2.2.5 vue-router 和tabs还是会报错

@An0nymous0 @bigrocs 今天吧

@bigrocs

vue-router 和tabs还是会报错

哪个 issue?问题是啥

没有开issue 当我切换路由 或者tabs标签发送http请求是都会报错如下
Element UI version
1.2.6
OS/Browsers version
chrome 57
Vue version
2.2.6 or 2.2.5

[Vue warn]: Error in destroyed hook:
TypeError: Cannot read property '__resizeListeners__' of undefined

@bigrocs
可否给重现链接?tabs 并没有使用 resize-event,也是 select 引起的么?

@QingWei-Li
我不确定什么引起的 我先排查下稍后给你答案

@bigrocs
应该是tabs或者路由切换的时候销毁select销毁,然后导致触发这个bug。
我就是这个情况。
所以还是select的bug。
你可以把页面所有select都删除了,就不会有这个bug了

@tbphp
好像不行 我使用table组件的的页面也出现这个情况

@bigrocs 你看你组件里面有没有select比如分页组件里面也有下拉组件。

@tbphp @QingWei-Li
我吧整个select引用都注释掉一样触发
我的好像是axios.post 访问开始触发这个BUG 奇怪..
然后访问结束在触发一次

不过正常打开的时候不触发 只有切换tabs 或者路由的时候触发
我的 切换tabs或者路由 都会执行axios.post

table也使用select组件 是我错了 。。。 确实是select引起的

@tbphp @QingWei-Li
我确定一件事情
分页组件 pagination 组件也引起了这个BUG

我也遇到了这个问题,每次页面切换时就会抛错
image

我也出现了同样的问题,将select删除后并不会出现该问题,应该是select本身的问题吧,不知道什么时候能够给出解决方案?

组件 pagination 组件好像也是引用select组件引起的..

什么时候发布修复版本

v1.2.7 has been released.

感谢!

tim 20170421194607
请问该问题现在是如何解决了?
我将vue 2.2.6版本 升到最高,然后elementUi 1.2.7也升级到最高后不可以解决该问题。
将版本降下来后vue是2.2.5也不行。有解决的么

@GaoYuanOnline 用 1.2.9

@Leopoldthecoder 升级到1.2.9后可以解决该问题,谢谢!

还是有问题,尝试降级vue为2.2.5也是一样的
image
image

@vincepeng 这都哪个版本了,你把你的包都npm-check -u升级一下,这个问题早就应该不存在了。

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Leopoldthecoder picture Leopoldthecoder  ·  52Comments

Leopoldthecoder picture Leopoldthecoder  ·  101Comments

Frondor picture Frondor  ·  31Comments

subo-romens picture subo-romens  ·  30Comments

Leopoldthecoder picture Leopoldthecoder  ·  82Comments