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

},

相关推荐
哆啦A梦15881 小时前
[前台小程序] 01 项目初始化
前端·vue.js·uni-app
智码看视界2 小时前
老梁聊全栈系列:(阶段一)架构思维与全局观
java·javascript·架构
小周同学@3 小时前
谈谈对this的理解
开发语言·前端·javascript
Wiktok3 小时前
Pyside6加载本地html文件并实现与Javascript进行通信
前端·javascript·html·pyside6
一只小风华~3 小时前
Vue:条件渲染 (Conditional Rendering)
前端·javascript·vue.js·typescript·前端框架
博客zhu虎康5 小时前
React Hooks 报错?一招解决useState问题
前端·javascript·react.js
灰海5 小时前
vue中通过heatmap.js实现热力图(多个热力点)热区展示(带鼠标移入弹窗)
前端·javascript·vue.js·heatmap·heatmapjs
码上暴富7 小时前
vue2迁移到vite[保姆级教程]
前端·javascript·vue.js
老华带你飞7 小时前
考研论坛平台|考研论坛小程序系统|基于java和微信小程序的考研论坛平台小程序设计与实现(源码+数据库+文档)
java·vue.js·spring boot·考研·小程序·毕设·考研论坛平台小程序
伍哥的传说7 小时前
Lodash-es 完整开发指南:ES模块化JavaScript工具库实战教程
大数据·javascript·elasticsearch·lodash-es·javascript工具库·es模块·按需导入