如何在boostrap vue中显示b-tabs中的按钮？

<template>
  <div>
    <!-- b-tabs 组件 -->
    <b-tabs content-class="mt-3">
      <!-- 第一个选项卡 -->
      <b-tab title="Tab 1" active>
        <template #title>
          <span>Tab 1</span>
          <button class="btn btn-primary ml-2">按钮</button>
        </template>
        这是第一个选项卡的内容。
      </b-tab>

      <!-- 第二个选项卡 -->
      <b-tab title="Tab 2">
        <template #title>
          <span>Tab 2</span>
          <button class="btn btn-secondary ml-2">按钮</button>
        </template>
        这是第二个选项卡的内容。
      </b-tab>

      <!-- 第三个选项卡 -->
      <b-tab title="Tab 3">
        <template #title>
          <span>Tab 3</span>
          <button class="btn btn-success ml-2">按钮</button>
        </template>
        这是第三个选项卡的内容。
      </b-tab>
    </b-tabs>
  </div>
</template>

<script>
export default {
  name: 'TabsWithButtons'
}
</script>

<style scoped>
/* 你可以在这里添加一些自定义样式 */
</style>