There are two ways to pass parameters in Vue routing, the difference between params and query methods

Dynamic routing can also be called routing parameters, which is to render different content in the same component according to different choices.

In terms of usage: query is introduced by path, params is introduced by name, and the receiving parameters are similar, which are this.$route.query.name and this.$route.params.nameurl display: params is similar to post, and query is similar to get, which is a security issue,

<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>
!-- 带查询参数，下面的结果为 /register?plan=private -->
<router-link :to="{ path: 'register', query: { plan: 'private' }}">Register</router-link>

It is relatively safer to pass the value of params. The query passes the parameter through the url, and the refresh page is still there, but the params refresh page is gone.