Sometimes, your Vue route will change, but will not trigger your router-view to update.

There is a simple way to tell the router-view , or any component, to update. Just bind the component key property to a reactive data source. In the case of router changes, you can bind the router-view to the $route.fullPath as follows:



<router-view :key= "$route.fullPath" ></router-view> <!-- more verbose with v-bind:key --> <router-view v-bind:key= "$route.fullPath" ></router-view>

Now, any time the full path changes, the router-view will be updated.



This work is licensed under a Creative Commons Attribution 4.0 International License.