基于vue+element UI的下拉树组件
ele-select-tree
属性(tree-select) 基于el-select+el-tree实现(推荐)
props
Build Setup基于vue+element UI的下拉树
# install dependencies npm install # serve with hot reload at localhost:8080 npm run dev # build for production with minification npm run build # build for production and view the bundle analyzer report npm run build --report
尝试了两种实现方式,推荐第二种
属性(select-tree) 基于el-popper+el-tree+el-input实现参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
v-model | 绑定值 | String/Number/Array | — | — |
width | 输入框宽度,如不指定则自适应容器 | String | — | — |
options | 选项数据 | Array | — | 必填 |
placeholder | 输入框占位符 | String | — | 请选择 |
props | 树节点配置选项,具体看下表 | Object | — | — |
multiple | 是否可多选 | Boolean | — | false |
filterable | 是否可过滤 | Boolean | — | false |
clearable | 是否可清空 | Boolean | — | true |
disabled | 是否禁用 | Boolean | — | false |
size | 输入框尺寸 | String | medium/small/mini | — |
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
v-model | 绑定值 | String/Number/Array | — | — |
options | 选项数据 | Array | — | [] |
placeholder | 输入框占位符 | String | — | 请选择 |
props | 树节点配置选项,具体看下表 | Object | — | — |
multiple | 是否可多选 | Boolean | — | false |
filterable | 是否可过滤 | Boolean | — | false |
clearable | 是否可清空 | Boolean | — | true |
disabled | 是否禁用 | Boolean | — | false |
accordion | 是否每次只展开一个同级树节点 | Boolean | — | false |
size | 输入框尺寸 | String | medium/small/mini | — |
checkStrictly | 父子节点选择状态是否不互相关联 | Boolean | — | false |
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
value | 指定节点实际值为节点对象的某个属性值 | String | — | 'value' |
label | 指定节点显示值为节点对象的某个属性值 | String | — | 'label' |
children | 指定子树为节点对象的某个属性值 | String | — | 'children' |
Demo
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。