小编T P*_*ick的帖子

我正在尝试做一个相当简单的可折叠菜单转换。我的元素看起来像：

<transition name="settings">
    <div v-show="!settingsCollapsed">
    </div>
</transition>

我的 css 看起来像

.settings-enter {
  max-height: 0px;
}
.settings-enter-active {
  max-height: 200px;
  transition: all 1s;
}
.settings-leave {
  max-height: 200px;
}
.settings-leave-active {
  max-height: 0;
  transition: all 1s;
}

我的菜单正确向上滑动，但是当它向下滑动时它没有动画。在我看来，它.settings-enter从未被应用过，它只是从隐藏到上课.settings-enter-active。

任何建议如何解决这个问题，或者为可折叠菜单设置动画的替代方法？

我正在Vue.js中创建一个电子商务类型菜单,其中的项目包含相当多的功能和图像.渲染大约200个这样的项目时性能相当不错,但是当添加的项目超过许多项目时,网站开始执行缓慢.

如果Vue元素位于当前可滚动视图之外(如iOS中的ScrollViews),那么从DOM中有条件地隐藏或删除Vue元素的最佳方法是什么？是否有任何插件或库可以帮助在Vue.js中执行长数据项列表？

谢谢!