vue组件v-select下拉多选框

v-select下拉多选框

先看看最终实现效果图

是vue的一个组件。用于下拉框多选的情况

1.需要的包文件

<script src="https://unpkg.com/vue@2.1.10/dist/vue.js"></script>
<script src="https://unpkg.com/vue-select@2.0.0/dist/vue-select.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />  

2.准备数据

var vm = new Vue({
    el: '#rrapp',
    updateTrue: false,
    data: {
        options: [],
        roleList: [],
        user: {
          
            roleId: '',
            roleName: '',
           
        }
    })

 

如果是静态的，则直接把数据写到options里面，如果是动态获取，则请求url后填充数据

  //渲染角色多选下拉框数据
            $.ajax({
                    type: "post",
                    url: baseURL