在vueJs循环中动态加载bootstrap-multiselect

Question

我正在尝试在VueJs循环中动态加载bootstrap-multiselect。

我想做这样的事情：

<div class="col-xs-6 col-sm-4 mb-1" v-for="params in param">

   <select class="mult" multiple="multiple">
       <option value="cheese">Cheese</option>
       <option value="tomatoes">Tomatoes</option>
   </select>

 </div>

但它无法正确加载 Check this out jsfiddle

拜托，我需要建议。

Answer 1

试试这个：

http://jsfiddle.net/Lw5us5y3/5/

我在更新的vue生命周期后调用multiselect的refresh方法。

$(function() {
    $('.mult').multiselect();
});

new Vue({
  el: '#app',
  data: {
    params: '',
    message: 'Test'
  },
  methods: {
    load: function() {
        this.params = [{value: 'cheese'},
        {value: 'tomatoes'}]
    }
  },
  updated: function(){
    $('.mult').multiselect('refresh');
  }
})

$(function() { $('.mult').multiselect(); }); new Vue({ el: '#app', data: { params: '', message: 'Test' }, methods: { load: function() { this.params = [{value: 'cheese'}, {value: 'tomatoes'}] } }, updated: function(){ $('.mult').multiselect('refresh'); } })