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

时间:2017-11-08 20:43:41

标签: javascript vue.js bootstrap-multiselect

我正在尝试在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

拜托,我需要建议。

1 个答案:

答案 0 :(得分:0)

试试这个:

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'); } })