vue.js - 如果 Vue 转换组显示没有影响，我做错了什么？

Question

我对 Vue 还是很陌生，但我正在尝试将转换组包装器应用到 v-for div 组，添加以下内容后完全没有影响。

有人能在这里看到问题吗？

这是模板的简化版本：

<template>
  <main>
      <div class="notes">
            <transition-group name="sort" tag="div" appear>
              <div v-for="post in posts" :key="post.id">
                <SinglePost :post="post" />
              </div>
            </transition-group>
      </div>
  </main>
</template>

和样式标签：

<style scoped>

  /* TRANSITION  */
  .sort-enter-active, .sort-leave-active {
    transition: opacity .5s;
  }

  .sort-enter {
    transform: translateY(10px);
    opacity: 0;
  }

  .sort-move {
    transition: transform .5 ease-out;
  }
</style>

标签： vue.jsvue-componentvuexcss-transitions