When we click on the button, the taxiCalled variable turns true and Vue inserts the taxi into your page. Before actually doing this, it reads the classes you specified in enter-class (in this case, only slideInRight) and applies it to the wrapped element (the <p> element with the taxi emoji). It also applies the classes specified in enter-class-active (in this case, only go).
The classes in enter-class are removed after the first frame, and the classes in enter-class-active are also removed when the animation ends.
The animation created here follows the FLIP technique that is composed of four points:
- First (F): You take the property as it is in the first frame of your animation; in our case, we want the taxi to start somewhere ...
