bootstrap以及bootstrap模糊搜索多选下拉框安装及使用

bootstrap

1、bootstrap安装

npm install bootstrap

2、在main.js进行导入就可以了

import 'bootstrap/dist/css/bootstrap.min.css'

import 'bootstrap/dist/js/bootstrap.min'

bootstrao模糊搜索多选框

1、安装

npm install bootstrap-select

2、定义渲染区域

<select v-model="passUserId" class="form-control form-control-sm selectpicker" multiple data-live-search="true" id="passUser" data-size="6" >
</select>

定义内容说明看下面

3、进行渲染

oaEmpList：渲染的数据列表来源

$('#passUser').empty()
let option = ''
option += "<option value=''>" + '请选择' + '</option>'
this.oaEmpList.forEach(el => {
  option += "<option value='" + el.recordId + "'>" + el.name + '</option>'
})
$('#passUser').append(option)
$('#passUser').selectpicker('val', this.passUserId)
$('#passUser').selectpicker('render')
$('#passUser').selectpicker('refresh')
$('#passUser').selectpicker()

放官网文档，里面有该插件提供的方法和属性

http://developer.snapappointments.com/bootstrap-select/