vue过度动画失效之坑

给一个固定定位的A标签加上vue的transition动画时，如果A标签的css有transform属性时，vue的一些过度动画会失效；

A{
    width: 6.6667rem; // height: 4rem;
    background-image: url("./assets/image/envelop.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: fixed;
    top: 30%;
    left: 0;
    right: 0;
    margin: 0 auto;
    transform: translateX(-3.333rem);
    z-index: 99999;
}
  .gift-Panel-enter-active,
  .gift-Panel-leave-active {
    transition: all 0.4s;
  }
  .gift-Panel-enter {
    transform: scale(1.5)
  }
  .gift-Panel-leave-to {
    transform: scale(.2)
  }
  此刻transtion动画并不会生效，只有把A标签的transform注释掉，才会有动画，（透明过度动画除外）
复制代码