Swift中 Cascader级联列表前端实现

Swift中 Cascader级联列表前端实现

使用背景

为了适应数据显示和使用的多样性和多元性，在Swift项目中有很多地方我们用到了层叠或者瀑布的结构（Cascader）。当一个数据集合有清晰的层级结构时，可通过级联选择器逐级查看并选择。比如Swift项目中物料的BOM里面，项目的schedule里面，还有数据列表里

例图如下：

级联列表的创建，修改以及删除的后端部分已经由Taylor介绍过了，这里不再赘述。

1、Cascde的主要数据结构是由若干条主数据及相应的children子数据构成；同时子数据中又可能同时包含相同的结构，前端需要做的就是将相应的数据进行解析并建立相应的page页面的结构。

2、Cascde级联列表，我们可以通过配置 tree-config 和指定列 tree-node 属性来开启树表格，通过 tree-config={expandAll: true} 设置默认展开所有树节点，通过 row-id 指定主键，还可以通过 trigger 指定触发方式。而且我们可以通过图中4个按钮对这张表进行相应的增删改查。

3、在Swfit项目应用中我们会发现整体数据结构展现的非常清晰，而且很容易选中自己想要的选项。

同时，在Swift项目中我们同时可以选择普通List或者Multilist两种类型，只需要在相应项目中class进行配置好即可。