选择代替列表

Question

我有以下标签列表，效果很好

%ul.nav.nav-pills.nav-fill{role: "tablist"}
  %li.nav-item
     = link_to "#home", class:"nav-link active show", "data-toggle" => "tab" do
        Home
  - @matrices.each do |matrice, i|
      %li.nav-item
        = link_to "#matrice_#{matrice.id}", class:"nav-link", "data-toggle" => "tab" do
           = matrice.name

使用

.tab-content
    %div{id:"home", class:"tab-pane active", role: "tabpanel"}
      CONTENT
     - @matrices.each do |matrice, i|
        %div{id:"matrice_#{matrice.id}", class:"tab-pane", role: "tabpanel"}
          CONTENTS   

我希望选择一个引导程序来解决UX问题，而不是使用nav的标签表

我该怎么办？这是我尝试过的方法，但指向选项卡ID的链接不起作用

%select.nav.selectpicker{role: "tablist"}
  %option
    = link_to "#home", class:"nav-link active show", "data-toggle" => "tab" do
      Home
  - @matrices.each do |matrice|
    %option
      = link_to "#matrice_#{matrice.id}", class:"nav-link", "data-toggle" => "tab" do
        = matrice.name