Django + Bootstrap折叠表格前端问题？

<!-- 导入Bootstrap的CSS和JavaScript文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

<!-- 定义表格结构 -->
<table class="table">
  <thead>
    <tr>
      <th scope="col">姓名</th>
      <th scope="col">年龄</th>
      <th scope="col">邮箱</th>
    </tr>
  </thead>
  <tbody>
    <!-- 使用Django模板语言渲染数据 -->
    {% for person in person_list %}
    <tr>
      <td>{{ person.name }}</td>
      <td>{{ person.age }}</td>
      <td>{{ person.email }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>

<!-- 添加折叠/展开功能 -->
<button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTable" aria-expanded="false" aria-controls="collapseTable">
  折叠/展开表格
</button>

<div class="collapse" id="collapseTable">
  <table class="table">
    <!-- 表格内容 -->
  </table>
</div>