1、有2种方式去传参,如下代码:
这里是首页注册reg 注册reg
特别需要注意的是:传参的时候,to属性必须绑定,即 :to= ,冒号必须有。否则如下图
同时需要注意template下的根标签只能有一个哦,否则会报错。
无:
有:
所以平时我们书写的时候不管怎样,都带上冒号就可以啦。
从图中可以看到:当使用对象形式的时候,是为我们进行了转码;当使用字符串拼接的时候,是直接显示数据。
传递多个参数:
{ path:"/detail/:id/:title", name:"detail", component:detail}
{
{ this.$route.params.id}}{
{ this.$route.params.title}}
2、也是2种方式接受参数
{ {$route.params.user}}
3、路由配置:
注意:如果传递参数,必须采用动态路由匹配,否则无法跳转。所以reg的path后面必须跟上:user
import Vue from 'vue'import Router from 'vue-router'import HelloWorld from '@/components/HelloWorld'import home from '@/pages/home'import detail from '../pages/goodsDetail'import Hello from '@/components/Hello'import reg from '@/components/reg'Vue.use(Router)export default new Router({ routes: [ { path: '/', name: 'Hello', component: Hello },{ path:"/reg/:user", name:"reg", component:reg } ]})