多级联动配置
最后更新于:2022-04-02 07:13:59
# JVXE多级联动
[TOC]
> * 该功能需要 JeecgBoot 2.4.7+ 版本
> * 多级联动只能作用于`JVXETypes.select`组件
> * 配置示例:src/views/jeecg/JVxeDemo/JVxeDemo3.vue
## 配置文档
JVXE内置了多级联动实现,只需要进行简单的配置即可。
### 组件配置
组件上新增`linkageConfig`参数,绑定一个数组,数组内每一项都是一个联动配置,所以可以实现多个相隔离的联动。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/83/e9/83e9fb5e7ee5d6d71bf40eca73fb24b7_348x230.png)
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/3d/2b/3d2bb3af29e1865098d9a9da2486e1a6_517x130.png)
* `key` 配置联动第一级的columnKey
* `requestData` 定义一个方法,返回Promise,Promise里返回一个数组,应用于`select`的下拉选项(须包含`value`、`text`字段)
### column 配置
column上只需要增加一个`linkageKey`属性即可,意思是联动下级。
比如第一级就填写第二级的columnKey,第二级填写第三级的columnKey,以此类推,有多少级就可以填写多少级。
### 完整配置示例
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/78/27/78273e6e64a2fa5daa370c5d0ebf0e11_500x869.png)
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/cf/f2/cff2311f6f0e4272d7204b51a6e85eea_633x234.png)
### 效果演示
演示地址:常见案例 --> JVXETable示例 --> 普通示例 --> 联动示例
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/f7/df/f7df1fbaa7edfc2404c41f3afaee56ea_766x255.png)
';