javascript - 无法使Vue.js CSS过渡正常工作？

CSS过渡的文档可以在here中找到。

可以肯定的是，我完全按照需要设置JSFiddle来进行过渡才能正常工作。不能完全确定，因为imo文档对CSS过渡有些了解。

我希望可以使用一些非常基本的HTML / CSS来使Vue.js创建良好的淡入淡出效果：

CSS：

.fade-transition {
  opacity: 1;
  transition: all .45s linear;
}

.fade-enter, .fade-leave {
  opacity: 0;
}

HTML：

<div class="loading-overlay" v-if="loading" v-transition="fade">
  In 5 seconds, this overlay should fade out...
</div>

但是，它似乎不起作用。有什么建议吗？

JSFiddle

最佳答案

对于transition标记中的div属性，只需将v-从transition之前删除即可，它将起作用。

<div class="loading-overlay" v-if="loading" transition="fade">
  In 5 seconds, this overlay should fade out...
</div>

关于javascript - 无法使Vue.js CSS过渡正常工作？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38437579/