路由的params参数

1.配置路由，声明接收params参数

export default new VueRouter({
  routes: [
    {
      name:'zhuye',
      path: '/home',
      component: Home,
      children: [
        {
          name:'xinwen',
          path: 'news',
          component: News
        },
        {
          name:'xiaoxi',
          path: 'message',
          component: Messages,
          children: [
            {
              name:'xiangqing',
              path: 'detail/:id/:title',//使用占位符，声明接收params参数
              component: Detail
            }
          ]
        },
      ]
    }
  ]
})

2.传递参数

1.跳转路由并携带params参数，to的字符串写法

 <router-link
          :to="`/home/message/detail/${msg.id}/${msg.title}`"
          >{{ msg.title }}</router-link>

2.跳转路由并携带params参数，to的对象写法

 <router-link
          :to="{
            name:'xiangqing',
            params: {
              id: msg.id,
              title: msg.title,
            },
          }"
          >{{ msg.title }}</router-link>

注意:传递params参数，若使用to的对象写法，必须通过name跳转，不能使用path跳转