Twitter bootstrap 引导选择不使用Vuejs中的动态填充选项

我正在尝试在我的一个项目中使用引导选择最初已经创建了选择选项，它可以正常工作，但是当选择的选项被动态构建时，插件不工作，也不会显示任何错误。我已经包括了$supplier\u id.selectpickerrender$供应商标识。选择PickerRefresh；正如在不同的答案中提出的那样，如和等等 但是，我仍然无法实现我想要的

Vue文件中的HTML代码如下所示

د پلورونکي ټاکنه {{Supplier.name} خوندی کړی اضافه کړی

---

从你的例子很难说确切的问题是什么。我想提出几点建议：

您不需要每次刷新引导选择时都实例化它。 使用vue的this.$nextTick函数运行依赖于要更新的dom以反映新数据的代码 下面是一个使用vue中的新值更新引导选择的简化演示

我建议将引导选择包装到组件中，这样您就可以在启动后清理dom。比如：

Vue.component('bootstrap-select', {
  template: '...',
  mounted: function() {
    $(this.$el).selectpicker();
  },
  beforeDestroy: function() {
    $(this.$el).selectpicker('destroy');
  }
});

编辑： 从您的评论来看，您似乎需要初始化一个新的引导选择。我建议为它创建一个组件。本文将帮助您开始：

或者，我已经调整了我的代码笔来破解一个解决方案。它使用v-bind:id属性为每个select提供一个唯一的id，并在添加新行时初始化引导选择

---

还有一个其他人制作的组件，用于复制github上的引导选择功能：

Hazza先生，感谢您的及时响应我想要的是动态添加两个，三个或更多下拉列表我不想动态地向下拉列表添加项目，因此当我添加新下拉列表时，引导选择不会应用于第二个下拉列表。那么，我建议@Hiws创建一个组件，就像我上面的例子一样，这样每当你呈现一个组件的新实例时，它就可以初始化引导选择。然而，对于一个肮脏的解决方案，我已经更新了我的代码笔：如果它工作得很好，请更新你的答案，这样我就可以为你投票，谢谢你对多个元素使用相同的id。id在页面上必须是唯一的。您应该尝试使用类作为选择器，而不是id。我这样做了，但结果相同。您可能需要按照Hazza的建议创建自己的组件，因为当组件自动装入时，这将初始化选择器选择器。或者尝试在$nextTick或setTimout中包装您的refresh Picker调用，以允许dom刷新。Hazza的选项将是最佳实践，而第二个选项则有点粗糙。我还建议尽量避免在Vue中使用jQuery，因为它们不能很好地协同工作