What is the difference between query and params in vue

Difference: 1. Query uses path to write the parameter transfer address, while params uses name to write the parameter transfer address; 2. The parameters will not disappear when query refreshes the page, but the parameters will disappear when params refreshes the page; 3. query The passed parameters will be displayed in the URL address bar, but the params passed parameters will not be displayed in the address bar.

The operating environment of this article: Windows 10 system, Vue version 2.9.6, DELL G3 computer.

What is the difference between query and params in vue

Query syntax:

this.$router.push({path:“地址”,query:{id:“123”}}); 这是传递参数
this.$route.query.id； 这是接受参数

params syntax:

this.$router.push({name:“地址”,params:{id:“123”}}); 这是传递参数
this.$route.params.id; 这是接受参数

Difference:

1 .First of all, the way of writing is different. The way of writing query is to use path to write the parameter transfer address, while the way of writing params is to use name to write the parameter transfer address. You can take a look at the relevant attributes when writing the route, and you can also output the routing object. Take a look at the information

2. The receiving methods are different, one uses query to receive, and the other uses params to receive. The summary is that whoever sends it will receive it

3.query parameters are not valid when refreshing the page will disappear, and params parameters will disappear when the page is refreshed. You can consider local storage to solve the problem.

4. The parameters passed by query are displayed in the url address bar, but the parameters passed by params will not be displayed in the address bar

【Related recommendation: "vue.js Tutorial"】

The above is the detailed content of What is the difference between query and params in vue. For more information, please follow other related articles on the PHP Chinese website!