Вью показывает тот же ездить

Question

У меня есть таблица с горками, как это:

<tr> 
     <td>{{ ride.user.name }}</td> 
     <td>{{ ride.location.from }}</td> 
     <td>{{ ride.location.to }}</td> 
     <td>{{ ride.type.name }}</td> 
     <td>{{ ride.date }}</td> 
     <td> 
      <a @click="show" class="btn-show">Show</a> 
      <a v-link="{ name: 'ritten' }" class="btn-edit">Bewerk</a> 
      <a v-link="{ name: 'ritten' }" class="btn-delete">Verwijder</a> 
     </td> 
     <td><show-ride-modal :ride="ride"></show-ride-modal></td> 
    </tr> 

Так что последний td убеждается будет всплывающее модальное, если нажать на show. В этом режиме видны более подробные сведения о выбранной поездке.

Проблема в том, что каждый раз одна и та же поездка передается модальному. Почему это?

EDIT

<table class="table" v-if="rides"> 
    <thead> 
     <tr> 
      <th>Door</th> 
      <th>Van</th> 
      <th>Naar</th> 
      <th>Type</th> 
      <th>Datum</th> 
     </tr> 
    </thead> 
    <tbody v-for="ride in rides" is="ride" :ride="ride"></tbody>  
    </table> 

Answer 1

Edit: После размещения этого я узнал, что Vue.js требует особого поведения в случае таблиц. См.: http://vuejs.org/guide/components.html#Template-Parsing.

Трудно ответить на вопрос, если нам нужно угадать, как выглядит остальная часть вашего кода. Однако я вижу некоторые странные вещи в вашем коде, поэтому, возможно, если вы посмотрите на них, проблема может быть исправлена.

Посмотрите на это:

<tbody v-for="ride in rides" is="ride" :ride="ride"></tbody> 

«является =„поездка“атрибута» и «: ездить =„ездить“» части, кажется, не делать ничего. 'is =' используется в динамическом компоненте компонента для назначения типа компонента, а ': ride' может использоваться для передачи реквизита для компонента. Но у вас нет компонента.

Мое предложение было бы изменить код для этого: