vue2 el-tree树形下拉框

由于element-vue2 中没有el-tree-select组件,所以树形下拉需要结合el-selet完成

<el-form-item label="上级部门:" prop="pidName">

<el-select

ref="select"

v-model="dialogForm.pidName"

placeholder="请选择上级部门"

clearable

>

<el-option style="height: auto;" :value="dialogForm.pidName">

<el-tree

:data="treeData"

:props="defaultProps"

:default-expand-all="true"

@node-click="handleNodeClick"

>

</el-tree>

</el-option>

</el-select>

</el-form-item>

treeData: [],

defaultProps: {

children: "children",

label: "name",

},

handleNodeClick(data) {

this.dialogForm.pidName = data.name; //点击渲染到选框里

this.departMentPid = data.id;

this.$refs.select.blur();

},

相关推荐
running up28 分钟前
Java集合框架之ArrayList与LinkedList详解
javascript·ubuntu·typescript
xiaoxue..33 分钟前
React 之 Hooks
前端·javascript·react.js·面试·前端框架
Alair‎37 分钟前
300TypeScript基础知识
javascript
莫物40 分钟前
element el-table表格 添加唯一标识
前端·javascript·vue.js
Shirley~~1 小时前
PPTist 幻灯片工具栏Toolbar部分
开发语言·前端·javascript
|晴 天|1 小时前
Promise 与 async/await 错误处理最佳实践指南
开发语言·前端·javascript
苹果电脑的鑫鑫1 小时前
.eslintrc.js这个文件作用
开发语言·javascript·ecmascript
vx_bisheyuange1 小时前
基于SpringBoot的便利店信息管理系统
前端·javascript·vue.js·毕业设计
晚烛1 小时前
智启工厂脉搏:基于 OpenHarmony + Flutter 的信创工业边缘智能平台构建实践
前端·javascript·flutter
Zsnoin能1 小时前
都快2026了,还有人不会国际化和暗黑主题适配吗,一篇文章彻底解决
前端·javascript