css - vuejs过渡组件外的元素应用了过渡效果

Question

Vue版本2.6.10

请参阅reproduction .

<router-link to="/a"><a name="/a">[a]</a></router-link>
<router-link to="/b"><a name="/b">[b]</a></router-link>
<router-link to="/c"><a name="/c">[c]</a></router-link>
<transition :name="transitionName">
  <router-view></router-view>
</transition>

这里有3条路线。从 A 切换到 B，路由器链路在移动。

路由器链接应该保持静止，因为它们不在转换标签中。它们在我的浏览器中是动画的。

我已尽力缩小复制品。使用其他转场效果，去掉挂载的钩子(Hook)或焦点操作，效果不显示。在其他路由对之间切换也不会触发此效果。

Answer 1

我已经弄清楚发生了什么。因为overflow: hidden，我没有看到clientWidth的变化。如果没有滚动条，当 input 元素获得焦点时，我没有看到 scrollX 的变化。这就是链接看起来像动画的原因。