vue下拉菜单

一个比较好用的下拉菜单 treeselect.js 有安装方法

<template>
 <treeselect
  :multiple="true" // 多选
   :options="personnel" // 数据项
   :disable-branch-nodes="true" // 是否阻止选择分支节点默认false 就是只能选子节点 数据项有children并且length>0才可以选 
   v-model="viewPeopleList" // id集合
   noChildrenText="暂无人员"  // children为空时显示 noChildrenText="暂无人员"
   search-nested  // 设置true搜索查询是否也应在所有祖先节点中搜索
   :appendToBody="true"  // 组件层级问题可能一般应该用不到
    z-index="9999999"
   :normalizer="normalizer" // 格式化数据的方法
   />
</temalate>
<script>
    import Treeselect from '@riophae/vue-treeselect'
    import '@riophae/vue-treeselect/dist/vue-treeselect.css'
    export default {
        components:{Treeselect},
        methods:{
            // 根据后台返回的数据自己处理,我的需求就是部门和人可以平级,树结构下每层有人有部门 但只能选人
            // 后台返回的数据都带children 这里空部门显示暂无数据（⬆上面属性有） 人员就删掉children树形（设置为null好像会报错）
        	if(node.children && !node.children.length && node.identity == 1){
                        delete node.children;
                    }
                    return {
                        id: node.id,
                        label:node.name,
                        children:node.children
                    }
         }
    }
    -----------------------------------------------------------------------
    1.:multiple="false" 单选时 v-moudle 的值要设置为null，如果 '' 会显示一个什么（unknow!）的字样
    2. 多选时 放在el-form-item中会继承40行高 组件上加个  style="width:200px;line-height:0px"
</script>