Testing Vue routing
We have currently got an application that renders our blog home page or feed view.
Next, we should have post pages. To do this, we will use Vue Router, as covered in previous chapters, and ensure that our routing works as designed with unit tests.
Vue Router is installed using npm
, specifically, npm install vue-router@4
, and then wiring it up in the main.js
file:
import { createApp } from 'vue' import App from './App.vue' import router from './router'; createApp(App).use(router).mount('#app')
Next, we can create a file to define our routes in src/router/index.js
. This will instantiate the router and define our initial paths. We will begin with a root path (/
) to display the PostList
component:
import { createRouter, createWebHistory } from 'vue-router'; import PostList from '@/components/PostList.vue'; const routes = [ Â Â { Â Â Â Â path: '/', Â Â ...