CODEWITHSUNDEEP
vue.jsnuxt.jsvue-router
Mobin Samani
Mobin Samani

Reputation: 275

Change Nuxt Route Without Re-rendering

I have a Nuxt page and i want to change route path without re-rendering or refreshing page with a method on a button.

if i do this.$router.push() or replace(), page will refresh and if i do window.history.pushState() or replaceState() that works fine but after that if i add a query with this.$router.push({ query: a = b }) on my page, page will refresh because changing route with window.history will not change $route and when i use this.$router.push, Vue Router thinks its a different page.

I've done a lot of search on internet and did not find anything, so please don't label this question as duplicate.

Upvotes: 3

Views: 5451

Answers (2)

Mobin Samani
Mobin Samani

Reputation: 275

Finally i solved this problem with using parent page and nuxt childs, i changed tabs to nav and rendered base components on parent page and other things on child pages and now it works fine. Tnx to @kissu and @Braks.

Upvotes: 1

kissu
kissu

Reputation: 46604

What you're actually looking for is a Default Layout and some nested routes. Here is an example on how to achieve this in Nuxt with just a few steps: https://nuxtjs.org/examples/routing-nested-pages

Upvotes: 3

Related Questions