动态路由匹配:
const router = new VueRouter({ routes: [ // 动态路径参数 以冒号开头 { path: '/user/:id', component: User } ] })
路由组件传参(query 传参)
this.$router.push({ path: `/analysis/eventCreate`, query: { id:this.id } })
感觉两者达到的效果是差不多的,都是给路由组件传参。只不过动态路由匹配在 url 上看不到参数名,而 query 传参的方式是放在?后面且能看到参数名和值。
只是显示上的区别吗?
query 传参的方式完全能满足使用需求,为啥官方要出一个动态路由匹配呢?
有什么优势吗?
params
传参更加贴合RESTful
架构的特征,便于记忆,对资源的表述更清晰;例如sf,
sf.gg/q/:id
,sf.gg/u/:id
各自代表问题页和用户资料页使用
query
传参更贴合get
请求的形式,比如分页场景。你用
params
传递分页多参数看看?/:sid/:size/:page
=>/6702C6712C675/1/15
这样? 太麻烦了,明显用query
传参就明了很多/list?id=6702C6712C675&size=15&page=3
根据不同的业务场景选择最合适的方式。