A
A
Artem Prokhorov2021-06-07 13:20:23
Vue.js
Artem Prokhorov, 2021-06-07 13:20:23

How to make route.push to the same page but with parameter change?

localhost:8080/menu/1 this is my link

1 this is the p parameter responsible for the page number, but it also has the s parameter responsible for the per-page for the rest api.
I do not want to display all the numbers in the link for filtering and pagination (because there can be more of them).
Therefore, I stupidly do not display the parameter s, but I want to change it in the code invisibly for the client.
But in this case, it changes the value (the console checked with a log before and after), but router.push does not perceive the link as new, here's how I write it:
this.$route.params.s = new value

this.$route.params.s = new value;
this.$router.push({ name: 'menu', params: { s: this.$route.params.s, p: nextPage }});


Is it possible to make vue routing understand that this is a new link, or does it only accept what is directly written in the URL?

And one more reason why I need this is to make it possible to move around the page through the browser buttons (arrows), since many users are just used to clicking them, so I want to sit on 2 chairs, and make the URL beautiful, and make router.push.

Answer the question

In order to leave comments, you need to log in

2 answer(s)
K
Konstantin B., 2021-06-07
@kotcich

You won't be able to hide the parameters and navigate the pages successfully. But so that Vue does not swear that you are trying to go to the same address, add .catch({}) after push

E
Evgeny Kulakov, 2021-06-07
@kulakoff Vue.js

In general, you need to check what is props: trueworth for this route and add the corresponding property for this component in propsand it should work like. You also need to take into account that already on this route, the component life cycle hooks will not be called, so if they have something in them, you need to transfer this logic to watch or generate a unique key for the component in order to force a redraw.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question