Как мне сделать, чтобы это выпадающее меню внутри заголовка таблицы работало в b-таблице - PullRequest
0 голосов
/ 01 декабря 2018

У меня есть b-таблица, заголовок которой я пытаюсь преобразовать в кнопку разделения, где левая часть кнопки может сортировать строки, в то время как правая часть кнопки имеет раскрывающийся список.Вот изображение, показывающее, чего я пытаюсь достичь enter image description here

Моя проблема в том, что раскрывающийся список вообще не открывается. Как сделать неупорядоченный список открытым вместо сортировки строк?когда я нажимаю на заголовок

<b-table :fields="columnDefinitions" :items="rows">
  <template slot="HEAD_name" slot-scope="data">
    <div class="btn-group d-flex">
      <button type="button" class="btn btn-light w-100 btn-sort">
        <i class="fa fa-sort-up"></i>
        <span>{{data.label}}</span>
      </button>
      <button
        type="button"
        class="btn btn-light dropdown-toggle dropdown-toggle-split"
        data-toggle="dropdown"
        aria-haspopup="true"
        aria-expanded="false"
      >
        <i class="fa fa-filter"></i>
        <span class="sr-only">Toggle Dropdown</span>
      </button>
      <ul class="dropdown-menu dropdown-menu-right">
        <form class="px-4 py-3">
          <div class="form-group">
            <select class="custom-select filter-options">
              <option value="1" selected>Above</option>
              <option value="-1">Below</option>
              <option value="0">Equal</option>
              <option value="2">Between</option>
            </select>
          </div>
        </form>
      </ul>
    </div>
  </template>
</b-table>
...