Question

我有一些要传递给html表的数据：

<tr v-for="room in rooms">
      <td>{{room.name}}</td>
      <td>{{room.owner}}</td>
      <td>{{room.id}}</td>
      <td><button @click="joinChatSession" class="btn btn-primary">Join</button></td>
</tr>

我从API获取此数据。我有一个函数joinChatSession，所以我的问题是，如何将room.id传递给该函数？我一次都为此感到挣扎，因为我不知道如何为表中的每个房间访问room.id。

我的功能如下：

$.ajax({
      url: `http://localhost:8000/api/rooms/${uri}/`,
      data: {username: this.username},
      type: 'PATCH',
      success: (data) => {
        const user = data.members.find((member) => member.username === this.username)
      }
    })

所以我需要传递我的room.id而不是这个$ {uri}，我如何才能访问它？

Answer 1

只需传递room.id作为参数。

<td><button @click="joinChatSession(room.id)" class="btn btn-primary">Join</button></td>

在v-for循环（Vue.js）中访问元素的数据

1 个答案: