不带参数:
<router-link to="/">Go to Home</router-link>
//to代表要跳转的路径(去哪儿)
<router-view></router-view>
//占位并展示 当前路径跳转的组件
带参数(动态路由匹配):
路径参数 用冒号 :
表示。当一个路由被匹配时,它的 params 的值将在每个组件中以 this.$route.params
的形式暴露出来。因此,我们可以通过更新 User
的模板来呈现当前的用户 ID:
传参方式可划分为 params
传参和 query
传参,
又可分为 声明式 和 编程式 两种方式
获取参数——在子路由中可以通过下面代码来获取传递的参数值:this.$route.push()
获取参数——编程式:this.$router.push()
两种传参方式的区别:
params是路由的一部分,必须要在路由后面添加参数名,如:
query是拼接在url后面的参数,没有也没关系,如:
<router-link :to="{name:'Child',query:{id:1}}">跳转到子路由</router-link>
直白的来说query相当于get请求,页面跳转的时候,可以在地址栏看到请求参数。
而params相当于post请求,参数不会再地址栏中显示。