如何从b-modal中的表中获取ID并显示在VUEJS中的页面上

<template>
  <div>
    <b-modal ref="myModal" @ok="handleOk">
      <table>
        <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <!-- 其他表头 -->
          </tr>
        </thead>
        <tbody>
          <tr v-for="item in items" :key="item.id">
            <td>{{ item.id }}</td>
            <td>{{ item.name }}</td>
            <!-- 其他表格内容 -->
          </tr>
        </tbody>
      </table>
    </b-modal>
    <button @click="openModal">打开模态框</button>
    <p>选中的ID：{{ selectedId }}</p>
  </div>
</template>

data() {
  return {
    selectedId: null,
    items: [
      { id: 1, name: 'Item 1' },
      { id: 2, name: 'Item 2' },
      // 其他数据项
    ]
  };
},

methods: {
  openModal() {
    this.$refs.myModal.show();
  },
  handleOk() {
    // 获取选中的ID
    const selectedRow = document.querySelector('tr.selected');
    if (selectedRow) {
      this.selectedId = selectedRow.querySelector('td:first-child').textContent;
    }
    this.$refs.myModal.hide();
  }
}

tr.selected {
  background-color: yellow;
}