版本
2.5.16
复现链接
https://jsfiddle.net/chrisvfritz/845Lee66/
重现步骤
- 打开 fiddle
- 点击 "Toggle" 按钮
- 观察
move过渡在进入时触发
预期结果
就像 v-if 一样，移动过渡在进入时不应该被触发(注意它已经在离开时没有被触发了)。
实际发生的情况
我还没有检查源代码，但我猜想，由于具有 display: none 的元素仍然具有坐标：
DOMRect { x: 0, y: 0, width: 0, height: 0, top: 0, right: 0, bottom: 0, left: 0 }因此，move 过渡在进入时被触发。我不确定为什么它在离开时不会触发。
这可能与 #5800 有关。另外，特别感谢 @rachelnabors 发现这个bug!
9条答案
按热度按时间iovurdzv1#
Woohoo!我成功地弄坏了什么东西！
jk9hmnmh2#
我能试一下这个问题吗？
gzjq41n43#
当然，欢迎😃
j2datikz4#
这个坐标是通过getBoundingClientRect方法获取的值。当display为none时，getBoundingClientRect方法的值为0。那么如何修改vue.js中的第8424行代码呢？
将第8424行代码改为：
这样就可以获取到正确的值了。
v1l68za45#
嘿，@wlkuro,我相信你是对的，这就是原因。但是我们不应该修改dist文件。这是一个自动生成的文件，但你建议的更改确实有效。
rdlzhqv96#
我认为更好的解决方案是在元素上不添加
v-move,并且不执行_enterCb,就像v-if一样。3npbholx7#
我明白了，这个
enterCb到底做了什么？oug3syen8#
对不起，我没有看到你的pr。
_enterCb应该在进入过渡完成或触发移动过渡时执行。但我认为v-show的行为与v-if相似更好。如果_enterCb被执行，v-show将失去进入过渡。4ioopgfo9#
我正在尝试一个来自文档的示例，并遇到了与描述相同的问题(例如切换按钮：https://codepen.io/pen/BGjJGL)。
由于PR仍然处于打开状态 - 目前是否有任何解决此问题的 workaround?使用
v-if完美运行，但由于性能原因，这不是一个选项。