Decoupling Params with Props

In the index.js file, let's adjust the configuration of the about route with an additional property called props. By setting this property's value to true, the router will automatically understand and map $route.params into the props component accordingly:

{
    path: '/about',
    name: 'about',
    component: () => import(/* webpackChunkName: "about" */       '../views/About.vue'),
    props: true
  }

In the About.vue file, we will declare the props type as follows:

props: {
    user: String
  }

And in the <template> section, we will replace $route.params.user with user:

<template>
  <div class="about">
    <h1>About {{user}}</h1>
  </div>
</template>

The output will still...