Javascript 启动选择初始化时Vue循环不工作

默认情况下，我的选择下拉列表中有一个循环，它正确地显示了数据

<select name="" id="input" class="form-control selectteam">
    <option value="" disabled="" selected="">Filter by team</option>
    <option v-for="(team, index) in  nblTeams" :value="team.clubName">{{team.clubName}}</option>
</select>

---

它还没有显示团队列表。顺便说一句，我正在使用

你试过使用nextTick吗？在vue时钟的下一个滴答声中初始化bootstrapselect

范例

编辑：

---

我不确定我所做的是否是解决我问题的好方法。添加了一个setTimeout方法，它可以正常工作

    this.getCurrentSeasonTeams().then( (response) => {
        if( response.status == 200 && typeof(response.data) == 'object' ) {
            this.nblTeams = response.data;
            if(typeof(this.nblTeams) == 'object'){
                setTimeout(() => {
                    $('.team').selectpicker();
                }, 500);
            }
        }
    });

---

我也有类似的问题，我通过如下方式添加setTimeout解决了这个问题：

setTimeout(function () {
   $('.select-reviewer').selectpicker();
}, 10);

或者，如果您已初始化selectpicker，则使用此选项：

setTimeout(function () {
   $('.select-reviewer').selectpicker('refresh');
}, 10);

此外，我还应该提到所选选项。Bootstrap select在初始化或刷新时从中删除任何“选定”属性，这就是为什么下面的代码会阻止此操作：

setTimeout(function () {
   $('.select-reviewer').selectpicker('val', $('.select-reviewer option:selected').val());
}, delay);

---

正如您从上面的代码中看到的，我们只是在初始化引导选择时在引导选择中设置值。

如何以及在何处运行jQuery？你能分享你的那部分代码吗？@ricopo我用的是laravel5.4。因此，我在bootstrap.js中需要jQuery，而在Vue mounted method中，我正在初始化引导选择。@ricopo是的，它需要设置超时才能工作，我认为引导选择在加载DOM后检查选择框是否有选项，在我的例子中，当我初始化引导选择时，循环可能还没有完成渲染，这就是为什么选择框没有选项。只是一个理论though@PenAndPapers检查我的编辑。如果列表为空，则超时方法可能会失败longer@TaufikAkbar是的，我做了，我应用了你的解决方案，谢谢，没有控制台错误@Taufik Akbar，我想我刚刚解决了，谢谢

setTimeout(function () {
   $('.select-reviewer').selectpicker();
}, 10);

setTimeout(function () {
   $('.select-reviewer').selectpicker('refresh');
}, 10);

setTimeout(function () {
   $('.select-reviewer').selectpicker('val', $('.select-reviewer option:selected').val());
}, delay);