Nuxt.js: asyncData() is not executed after changing route query using $router.push

[togishub]

Version

v2.4.5

Reproduction link

https://codesandbox.io/s/38pzrn9nk1

Steps to reproduce

1. Navigate to https://38pzrn9nk1.sse.codesandbox.io/?page=1
2. Notice "current route path" and "asyncData was excecuted for route" values in page
3. Click button "change route query", which will change route query using this.$router.push({ query: { page: rand_int } })
4. Notice, that the route (page URL) has changed, but asyncData() was not executed for the new page

What is expected ?

asyncData() should be executed for new route, even if just query param value changes. in this case ?page=

What is actually happening?

URL changes, but new page load cycle is not started, thus asyncData() is not executed too

_{This bug report is available on Nuxt community (#c8871)}

[henriqemalheiros]

You must enable the watchQuery property on the page component. You can read about it here.

[manniL]

As @henriqemalheiros said :relaxed:

[togishub]

thank you very much for a quick response! Everything is working now!

[ouyangfan]

@togishub How can I use the watchQuery property?thank you

[ouyangfan]

My problem is that query parameter changes don't want to update data asynchronously.