Cool UI

📓组件介绍

cl-canton-cascader是对a-cascader的二次封装，主要是用于省市区级联场景（当然也是不限层级的）。

⌨️代码演示

基本使用 

<cl-canton-cascader v-model:value="formModel.cantonIds" />
1
<cl-canton-cascader
  v-model:value="formModel.cantonIds2"
  use-provided
  :provided-data="providedData"
/>
1
2
3
4
5

💡注意事项

使用此组件时，如果不提供自定义数据源，就必须提供一个find接口，用于查询行政区域数据。

find接口通过cl-config-provider接口提供。

<cl-config-provider :services="services">
    <router-view></router-view>
</cl-config-provider>
1
2
3
const services = {
  cantonFind: cantonService.find.bind(cantonService),
};
1
2
3

📖属性

属性说明类型默认值
appendOptions额外的可选择数据，会与接口返回的数据拼接起来CantonDTO[][]
useProvided如果感觉每次加载行政区域数据太慢，可以自定义数据源booleanfalse
providedData自定义数据源CantonDTO[][]

其他属性/事件见Cascader Props。