1, demand: an object needs to move a distance, but this distance is not fixed, it may be 100pxMagne200px, which is dynamically calculated in JS.
2. I have tried to modify the transfrom in style directly and found that it is not compatible with the transition of vue. After modifying transfrom in JS, the transition of vue does not take effect, but if I use pure css to do animation, because my object is v-if to control the display, pure CSS has no effect.
3. I would like to ask you how to dynamically modify vue transition properties
<transition name="fade">
<div class="transition" ref="transition" v-if="boxShow"></div>
</transition>
.fade-enter-active, .fade-leave-active{
transition: all 2s;
.fade-enter, .fade-leave-to {
opacity: 0;
/*transform: translateY(500px)*/
transform: scale(0);
}