Laravel Vue Routing

问题描述:

我希望所有的tr都作为我的表中的路由器链接,但是当我在tr之前添加此内容时,表中的每个css消失并且我的View看起来很糟糕。是否有可能做得更好?Laravel Vue Routing

<table v-if="seenOrders" id="ordersTable" class="table"> 
     <tr> 
      <th>Numer zamówienia</th> 
      <th>Imię</th> 
      <th>Telefon</th> 
      <th>Email</th> 
      <th>Status</th> 
      <th>Data zamówienia</th> 
     </tr> 

     <router-link to="/orderDetail" class="order-row" > 
     <tr v-for="order in orders" v-on:click="details(order.id)"> 
      <td>{{order.number}}</td> 
      <td>{{order.client_name}}</td> 
      <td>{{order.phone}}</td> 
      <td>{{order.email}}</td> 
      <td>{{order.actual_status}}</td> 
      <td>{{order.order_date}}</td> 
     </tr> 
     </router-link> 
    </table> 

<router-limk>将默认呈现为<a>元件。如果你想改变如何<router-link>应该呈现使用tag道具(在你的情况<tr>

<router-link to="/orderDetail" tag="tr" class="order-row" > 

所以,你的代码应该是

<table v-if="seenOrders" id="ordersTable" class="table"> 
    <tr> 
     <th>Numer zamówienia</th> 
     <th>Imię</th> 
     <th>Telefon</th> 
     <th>Email</th> 
     <th>Status</th> 
     <th>Data zamówienia</th> 
    </tr> 

    <router-link to="/orderDetail" v-for="order in orders" tag="tr" class="order-row" > 
     <td>{{order.number}}</td> 
     <td>{{order.client_name}}</td> 
     <td>{{order.phone}}</td> 
     <td>{{order.email}}</td> 
     <td>{{order.actual_status}}</td> 
     <td>{{order.order_date}}</td> 
    </router-link> 
</table> 
<router-link>

见标签部分

+0

哇它帮助- 谢谢! – wenus