你基本上是在描述标签式药丸的行为。为什么不这样做呢？

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

<div class="m-4">
  <ul class="nav nav-pills" id="myTab" role="tablist">
    <li class="nav-item" role="presentation">
      <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#one" type="button" role="tab" aria-controls="one" aria-selected="true">Home</button>
    </li>

    <li class="nav-item" role="presentation">
      <button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#two" type="button" role="tab" aria-controls="two" aria-selected="false">Profile</button>
    </li>
  </ul>

  <div class="tab-content">
    <div class="tab-pane fade show active" id="one">
      Button 1 content
    </div>

    <div class="tab-pane fade" id="two">
      Button 2 content
    </div>
  </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

不可能使用切换来显示某些元素并隐藏其他元素。您需要使用javascript。一种选择是使用bootstrap api。请参阅事件。另一种方法是使用onclick事件的内联事件处理程序来实现您需要的功能。
请参见下面的示例。在本例中，第一个按钮的onclick事件处理程序从collapse2中删除了show类，反之亦然。

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2" crossorigin="anonymous"></script>
<button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapse1" aria-expanded="false" aria-controls="collapseExample" onclick="(function() { document.getElementById('collapse2').classList.remove('show'); })();">
    Button 1
  </button>
<button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapse2" aria-expanded="false" aria-controls="collapseExample" onclick="(function() { document.getElementById('collapse1').classList.remove('show'); })();">
    Button 2
  </button>
</p>
<div class="collapse" id="collapse1">
  Button 1 content
</div>
<div class="collapse" id="collapse2">
  Button 2 content
</div>