v-if与css动画矛盾，v-if时不显示动画效果

v-if与css动画矛盾，v-if时不显示动画效果的原因是v-if是根据条件来决定是否渲染元素，而css动画是基于元素的存在与否来进行动画效果的展示。当v-if条件为false时，元素会被完全移除，导致css动画无法生效。

解决这个问题的方法是使用v-show指令代替v-if指令。v-show指令也是根据条件来决定元素的显示与隐藏，但是它是通过修改元素的display属性来实现的，而不是完全移除元素。这样就可以保持元素的存在，从而使得css动画能够正常展示。

下面是一个示例代码：

<transition name="fadeBox">
  <div v-show="allGoodsPrice > 0" id="shoppingCart">
    <text>我将进行动画过渡</text>
  </div>
</transition>

通过使用v-show指令，即使条件为false时，元素仍然存在于DOM中，从而保持了css动画的展示效果。