To add animation effects to the list, you need to add the transition-group tag outside the li tag. It
should be noted here that the transition-group tag is not the transition tag when adding the tags that need to be used for the animation effect for multiple rows of data.
And since the transition-group tag defaults to the span tag, you need to pay attention to adding the tag tag to ul and commenting out the original ul tag.
Finally, add the animation effect you want to achieve
On this basis, how to achieve the animation effect of the table form
First of all, what I think of should be that the use of tags is also the transition-group tag.
Then you need to consider the position of the transition-group tag.
Based on the idea of adding animation to the li tag,
test whether the two methods are successful
. The first one: add transition outside the tbody -group tag (this method is not feasible)
Second: write the table tag into the tag of transition-group (this method is not feasible)
Finally, I found a solution in the vue document
. Use is to add the transition-group attribute in tbody, and then add the animation effect you want to achieve.
