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();

},

相关推荐
To_OC2 分钟前
搞懂二叉树递归遍历,我居然是从爬楼梯开始的
前端·javascript·数据结构
用户7229134504529 分钟前
数字故障美学:用 Canvas 实现 RGB 偏移、像素排序与扫描线
javascript
英勇无比的消炎药10 分钟前
一套代码多端运行TinyVue响应式开发
vue.js·响应式设计
小森林之主11 分钟前
深入正则表达式:核心语法与实战剖析
javascript·python·正则表达式·编程技巧·字符串处理
SwJieJie25 分钟前
Webpack vs Vite 构建工程化实战(Vue 项目深度解析)
前端·vue.js·webpack·node.js
alexander06837 分钟前
JavaScript 中,对象内部函数的几种等价写法,对象外部的 几种等价写法
javascript
云水一下38 分钟前
Vue.js从零到精通系列(八):项目实战——构建一个完整的电商后台管理系统
前端·javascript·vue.js
Csvn39 分钟前
Vue3 响应式陷阱:解构赋值后页面不动了?Proxy 的"隐形成员"在搞鬼
前端·vue.js
LAM LAB1 小时前
【Web】网页如何模拟移动端获取定位\定位模拟测试
开发语言·前端·javascript
小森林之主1 小时前
JavaScript 正则表达式:从零开始的实战对比
javascript·正则表达式·前端开发·性能对比·文本处理