In this recipe, we will build a website for a restaurant for ghosts. It won't be much different from the website of a regular restaurant, except for the requirements that the pages must fade instead of appearing instantly.
Let's put down some HTML layout, shall we:
<div id="app"> <h1>Ghost's Restaurant</h1> <ul> <li><router-link to="/">Home</router-link></li> <li><router-link to="/menu">Menu</router-link></li> </ul> <transition mode="out-in"> <router-view></router-view> </transition></div>
Note how we wrapped the main router display port with a transition tag. The mode out-in is set because we want the animation for the disappearing component to finish before the other component appears. If we hadn't we set that, the two ...
