Laravel 5.3 Vue 2 Laravel 5.3引导4手风琴

不确定哪里出了问题，下面的代码将生成一张面板状的卡片，显示表格和标题，但不是交互式手风琴。我从inspect检查代码，它显示的结构与引导示例显示的结构完全相同。我试图将引导示例直接复制到我的Vue中，但它碰巧也有问题，但如果我将它们放到php视图中，它就可以工作了。因此，我怀疑我的Vue没有正确读取引导JS。但是我已经把

require（'./bootstrap'）

进入我的app.js，我希望这也会激活我Vue中的js。请帮忙。虽然我不认为代码有任何帮助，但我仍然会附上它供您参考。这似乎不是我的问题

Item-sorting-liost.vue

<template>
   <div>
     <div id="accordion" role="tablist" aria-multiselectable="true">
        <div v-for="cat in cats" class="card">
          <div class="card-header" role="tab" :id="'heading'+cat.id">

              <a
              data-toggle="collapse" 
              data-parent="#accordion" 
              :href="'#collapse'+cat.id" 
              aria-expanded="false" 
              :aria-controls="'collapse'+cat.id"
              >
                {{cat.name}}
              </a>
          </div>

          <div :id="'collapse'+cat.id" class="collapse in" role="tabpanel" :aria-labelledby="'heading'+cat.id">
            <ul class="list-group">
              <li
              v-for="subcat in subcats" 
              v-if="subcat.category_id == cat.id" 
              class="list-group-item"
              >
                <a 
                :name="subcat.name" 
                href="" 
                @click.prevent="getSelectedSubcatProducts(subcat.id)"
                >{{subcat.name}}</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
</template>

这是一个迟来的答案，但很难让jQuery和Vue很好地相互配合，原因如下：

---

如果您想在Vue.js中使用Bootstrap，我建议您使用。

谢谢您的回答，但我很难证明它是否适合继续使用。我会投你一票！谢谢你的贡献。