DEV Community

Cover image for Vue Tip / Same component, different route
Salvador García
Salvador García

Posted on

Vue Tip / Same component, different route

Let's get to the point. As developers we look for a high level of reusability in our components, this is why Vue doesn't re-render the parent component when used in two different paths despite not being the same view, but the same component. This is done by Vue to optimize the app. To solve this problem, just add a key to the router-view as the name of the route or the path.

  <template>
    <div>
       <! --- Or $route.path --->
      <router-view :key="$route.name" />
    </div>
  </template>

Enter fullscreen mode Exit fullscreen mode

I hope it helps

Happy Coding! :v

Top comments (0)