第三方控件初始化 - Vue.set 和 .$nextTick 的问题
发布于 3 年前 作者 huaer 1354 次浏览 来自 问答
粉丝福利 : 关注VUE中文社区公众号,回复视频领取粉丝福利

Bootstrap 4 + selectpicker (可以搜索的 select 控件)
select项通过 ajax 载入后通过 Vue.set 来填入数据,然后通过 .$nextTick 调用控件的初始化。
但是偶尔会出现初始化好的控件没有选项( 初始化时原来的select 选项没有渲染完成 )

有什么方法避免这种情况?
以下相关代码

<select class="form-control selectpicker" data-style="btn-default" data-live-search="true" name="group_id" v-model="options.selectGroup">
    <option v-for="(item,idx) in options.groups" :value="item.group_id"  v-html="item.name"></option>
</select>
var that = this;
$.get(that.script , {type:'groups'},function(result){
    if(result.MsgId){
}else{
    Vue.set(that.options , 'groups' , result.groups);
        that.$nextTick(function(){
            $('.selectpicker').selectpicker();
            if( location.get('group')){
                $('.selectpicker').selectpicker('val',location.get('group'));
            }
        })
    }
})
回到顶部