AUCascadePicker 为多级级联选择器控件，最多支持三级。
效果图
接口说明
// 设置选择器的选中项@interface AUCascadePickerSelectedRowItem : NSObject@property (nonatomic, strong) NSString *selectedLeftTitle; // 当前第一子列表选中的 title@property (nonatomic, strong) NSString *selectedMiddleTitle; // 当前第二子列表选中的 title@property (nonatomic, strong) NSString *selectedRightTitle; // 当前第三子列表选中的 title@end@interface AUCascadePickerRowItemModel : NSObject@property (nonatomic, strong) NSString *rowTitle;@property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *> *rowSubList;@end// 联动效果所需要的数据模型@interface AUCascadePickerModel : NSObject@property (nonatomic,strong) AUCascadePickerSelectedRowItem *preSelected; // 业务方传进来的选中项@property (nonatomic, strong) AUCascadePickerSelectedRowItem *selectedItem; // 当前组件内自行记录的选中数据列表@property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *> *dataList ; // 数据列表@property (nonatomic, strong) NSString *title; // 选择器标题@end@interface AUCascadePicker : AUPickerBaseView <UIPickerViewDataSource, UIPickerViewDelegate>@property (nonatomic, strong) AUCascadePickerModel *dataModel;@property (nonatomic, assign) NSInteger numberOfComponents;@property (nonatomic, weak) id <AUCascadePickerDelegate> linkageDelegate;- (instancetype)initWithPickerModel:(AUCascadePickerModel *)model;@end// 顶部“取消” & “完成” 的回调@protocol AUCascadePickerDelegate <AUPickerBaseViewDelegate>/** 点取消时回调*/- (void)cancelPickerView:(AUCustomDatePicker *)pickerView;/** 点完成时回调，选中项可通过 selectedRowInComponent返回*/- (void)selectedPickerView:(AUCustomDatePicker *)pickerView@end
JSAPI 说明
接口
antUIGetCascadePicker
使用
AlipayJSBridge.call('antUIGetCascadePicker',{title: 'nihao',//级联选择标题selectedList:[{"name":"杭州市",subList:[{"name":"上城区"}]}],list: [{name: "杭州市",//条目名称subList: [{name: "西湖区",subList: [{name: "古翠街道"},{name: "文新街道"}]},{name: "上城区",subList: [{name: "延安街道"},{name: "龙翔桥街道"}]}]//级联子数据列表}]//级联数据列表},function(result){console.log(result);});
入参
| 名称 | 类型 | 描述 | 必选 | 默认值 | 版本 |
|---|---|---|---|---|---|
| title | String | 级联控件标题 | NO | — | 10.1.2 |
| selectedList | Json | 选中态，指定选中的子项，格式与入参一致 ([{"name":"杭州市",subList:[{"name":"上城区"}]}]) |
NO | — | 10.1.2 |
| list | Json | 选择器数据列表 | YES | — | 10.1.2 |
| name | String | 条目名称，list 内的 name | YES | — | 10.1.2 |
| subList | Json | 子条目列表，list 内的 subList | NO | — | 10.1.2 |
| fn | Function | 选择完成后的回调函数 | NO | — | 10.1.2 |
出参
| 名称 | 类型 | 描述 | 版本 |
|---|---|---|---|
| success | bool | 是否选择完成，取消返回 false | 10.1.2 |
| result | Json | 选择的结果，如 [{"name":"杭州市",subList:[{"name":"上城区"}]}] |
10.1.2 |
代码示例
model = [[AULinkagePickerModel alloc] init];NSMutableArray *modelList = [[NSMutableArray alloc] init];for (int i=0; i<6; i++){AULinkagePickerRowItemModel *item = [[AULinkagePickerRowItemModel alloc] init];item.rowTitle = [NSString stringWithFormat:@"第一层的%d", i];NSMutableArray *array = [[NSMutableArray alloc] init];for (int j=0; j<7; j++){if (i == 0){break;}AULinkagePickerRowItemModel *item1 = [[AULinkagePickerRowItemModel alloc] init];item1.rowTitle = [NSString stringWithFormat:@"第二层的%d", j];NSMutableArray *array1 = [[NSMutableArray alloc] init];for (int k=0; k<5; k++) {AULinkagePickerRowItemModel *item2 = [[AULinkagePickerRowItemModel alloc] init];item2.rowTitle = [NSString stringWithFormat:@"第三层的%d", k];[array1 addObject:item2];if (j == 1 || j== 2) {break;}}item1.rowSubList = array1;[array addObject:item1];if (i == 3 || i== 5) {break;}}item.rowSubList = array;[modelList addObject:item];}model.dataList = modelList;AULinkagePickerSelectedRowItem *item = [[AULinkagePickerSelectedRowItem alloc] init];item.selectedLeftTitle = @"第一层的0";item.selectedMiddleTitle = @"第二层的0";item.selectedRightTitle = @"第三层的0";model.selectedItem = item;self.linkagePickerView = [[AULinkagePickerView alloc] initWithPickerModel:model];self.linkagePickerView.linkageDelegate = self;[self.linkagePickerView show];
