routes传递参数

image.png

1 用:to传递参数 {{$route.params.us}}

 
  <router-link :to="{name:'x1',params:{us:'xiao',xx:'zhazha'}}" >xin-x1</router-link>|
  <router-link :to="{name:'x2',params:{pa:'sun'}}">xin-x2</router-link>

<template>
  <div class="hello">
   x2页面==
   {{$route.params.pa}}
  </div>
</template>

2 用 {{$route.name}} 取值
html

1 html 
 <div class="hello">
    <div>
        <span v-bind:title="message">
            鼠标悬停几秒钟查看此处动态绑定的提示信息！
        </span>
        999--- {{$route.name}}
    </div>
    <router-view></router-view>
  </div>
2  routes
routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },{
      path: '/xin',
      component: titv,
      children:[
        {
          path: '/',
          name: 'titv',
          component: titv,
        },
        {
          path: 'x1',
          name: 'x1',
          component:  titv1
        },{
          path: 'x2',
          name: 'x2',
          component:  titv2
        }
      ]
    }
  ]