这是一个创建于 2099 天前的主题，其中的信息可能已经有所发展或是发生改变。
最近碰到一个奇怪的问题，请大手子看一下
repro： https://codepen.io/niaodan2b/pen/drxQBw
步骤：把光标放在 input 里，然后关闭 dialog，然后点击页面空白处，会在控制台看到报错
按我的理解，dialog 关闭的时候，组件就销毁了，此时应该会自动解除内部元素的 v-on:blur 吧？为什么点击页面空白处还会触发呢？
 |
1
keepeye 2019-03-29 15:50:13 +08:00
Note: Document.activeElement 的值随浏览器的不同而不同 (bug 452307): IE10 把值设为焦点将要移向的对象 , 而 Firefox 和 Chrome 往往把值设为 body .
https://developer.mozilla.org/zh-CN/docs/Web/Events/blur |
 |
2
shintendo OP @keepeye
没懂，是说关闭 dialog 后焦点移到了 body 吗？我的意思是关闭 dialog 之后这个 blur 事件为什么依旧存在呢？ |
 |
3
dixeran 2019-03-29 16:33:06 +08:00
chrome 72 有报错，FF 67 没有..
|
|
4
keepeye 2019-03-29 18:08:46 +08:00
@shintendo
我猜 js 怎么知道你 blur 了呢？是不是依靠你点击了 input 的之外的地方？是不是相当于 $("body").onclick 呢？你移除了 input 但是点击事件还在 body 上。 |
 |
5
noe132 2019-03-29 20:01:06 +08:00
不是 Vue 也不是 dialog 的问题。
理论上 input 销毁后只会触发一次 blur。 chrome 的表现是 blur 后强行 focus，结果元素不存在继续触发 blur，又强行 focus 因为 vue 是异步渲染的，所以只会有一次报错。我手写了段同步渲染的代码，会导致 chrome 爆栈。 目测是 chrome 在销毁 input 时的 bug https://paste.ubuntu.com/p/G5nys4wWgR/  打开一个空页面运行这个 run 函数 点击获取焦点再点外面失去焦点 同步删除 chrome 会爆栈，异步删除 chrome 会出现你的例子一样的错误 firefox 和 edge 表现正常 目测应该给 chromium 提 issue 建议不要再 blur 里写 focus，或者先判断一下 |
Select Language