若依框架前后端分离treeselect 添加里部室下拉选择框

原创

已于 2023-06-16 11:10:58 修改 · 1.2k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

于 2023-06-16 11:04:51 首次发布

该文章演示了如何在若依框架中使用treeselect组件实现前后端分离的部门选择功能。通过添加dept_id字段到数据库表，创建index.vue组件，利用deptTreeSelect方法获取部门树数据，并在Vue实例中处理数据和展示。

若依框架前后端分离treeselect 部室下拉选择框

温馨提示：记得数据库建表时，在自己新建的表内加一个dept_id字段，方便后续写表链接

新生成的index.vue
在这里插入图片描述

//对deptId进行操作，包括后续也是将deptId存入表内，通过表连接查询显示部门名称
<el-form-item label="单位部室" prop="deptId">
    <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择部门" />
</el