vue-bootstrap-selectpicker
https://long-woo.github.io/vue-bootstrap-selectpicker
依赖库
Vue.js(v2.20+)
Bootstrap(v4.0.0+) 推荐使用
Bootstrap-Vue库
使用
npm（yarn）安装
npm i vue-bootstrap-selectpicker # yarn add vue-bootstrap-selectpicker// 在main.js里面加入以下代码
import 'vue-bootstrap-selectpicker/dist/css/vue-bootstrap-selectpicker.min.css'
import SelectPicker from 'vue-bootstrap-selectpicker'
Vue.use(SelectPicker)浏览器
<head>
...
<link ref="stylesheet" href="/vue-bootstrap-selectpicker/dist/css/vue-bootstrap-selectpicker.min.css">
</head>
<body>
...
<script src="/vue-bootstrap-selectpicker/dist/js/vue-bootstrap-selectpicker.js"></script>
</body>示例 更多...
<select-picker :dropdown-data="dropdownData" placeholder="请选择..." v-model="defaultSelectText" @change="changeSelect" />export default {
data () {
return {
...
dropdownData: ['Vue', 'React', 'Angular', 'jQuery'],
defaultSelectText: ''
}
},
methods: {
...
changeSelect ({data, text}) {
console.log(data)
this.defaultSelectText = text
}
}
}