如何将Vue.js路由与数据道具一起使用？

Question

我想通过使用DispatchManage/OM123456ES1数据来制作类似DispatchManage/OM123456ES2，dispatchnum的路由器。

我想做的是单击dispatchnum.name，然后用户可以看到诸如DispatchManage/OM123456ES1地址之类的详细信息页面。

我该怎么办？并且在添加数据时，还应该添加地址

下面是我的代码

-DispatchManage.vue-

<td class="text-xs-center" style="color: #53b4f5">
                    <router-link :to ="{name: 'DispatchManage', params:{name:item.name}}">{{ props.item.name }}</router-link>
                  </td>
                  <td class="text-xs-center">{{ props.item.date }}</td>
                  <td class="text-xs-center">{{ props.item.status }}</td>
                  <td class="text-xs-center">{{ props.item.carNum }}</td>
                  <td class="text-xs-center">{{ props.item.model }}</td>
                  <td class="text-xs-center">{{ props.item.applicant }}</td>
                  <td class="text-xs-center">{{ props.item.driver }}</td>
                  <td class="text-xs-center">{{ props.item.applydate }}</td>

dispatchnum: [
        {
          value: false,
          name: 'OM123456ES1',
          date: '19/01/02 12:00:00 - 19/01/03 12:00:00',

        },
        {
          value: false,
          name: 'OM123456ES2',

        },
        {
          value: false,
          name: 'OM123456ES3',
        }

在路由器目录index.js中

{
  path: '/DispatchManage/:name',
  name: 'DispatchManage',
  component: DispatchManage,
}