全部产品
云市场
云游戏

级联选择器

更新时间:2019-09-26 18:39:50

AUCascadePicker 为多级级联选择器控件,最多支持三级。

效果图

cascade

接口说明

  1. // 设置选择器的选中项
  2. @interface AUCascadePickerSelectedRowItem : NSObject
  3. @property (nonatomic, strong) NSString *selectedLeftTitle; // 当前第一子列表选中的 title
  4. @property (nonatomic, strong) NSString *selectedMiddleTitle; // 当前第二子列表选中的 title
  5. @property (nonatomic, strong) NSString *selectedRightTitle; // 当前第三子列表选中的 title
  6. @end
  7. @interface AUCascadePickerRowItemModel : NSObject
  8. @property (nonatomic, strong) NSString *rowTitle;
  9. @property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *> *rowSubList;
  10. @end
  11. // 联动效果所需要的数据模型
  12. @interface AUCascadePickerModel : NSObject
  13. @property (nonatomic,strong) AUCascadePickerSelectedRowItem *preSelected; // 业务方传进来的选中项
  14. @property (nonatomic, strong) AUCascadePickerSelectedRowItem *selectedItem; // 当前组件内自行记录的选中数据列表
  15. @property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *> *dataList ; // 数据列表
  16. @property (nonatomic, strong) NSString *title; // 选择器标题
  17. @end
  18. @interface AUCascadePicker : AUPickerBaseView <UIPickerViewDataSource, UIPickerViewDelegate>
  19. @property (nonatomic, strong) AUCascadePickerModel *dataModel;
  20. @property (nonatomic, assign) NSInteger numberOfComponents;
  21. @property (nonatomic, weak) id <AUCascadePickerDelegate> linkageDelegate;
  22. - (instancetype)initWithPickerModel:(AUCascadePickerModel *)model;
  23. @end
  24. // 顶部“取消” & “完成” 的回调
  25. @protocol AUCascadePickerDelegate <AUPickerBaseViewDelegate>
  26. /*
  27. * 点取消时回调
  28. */
  29. - (void)cancelPickerView:(AUCustomDatePicker *)pickerView;
  30. /*
  31. * 点完成时回调,选中项可通过 selectedRowInComponent返回
  32. */
  33. - (void)selectedPickerView:(AUCustomDatePicker *)pickerView
  34. @end

JSAPI 说明

接口

antUIGetCascadePicker

使用

  1. AlipayJSBridge.call('antUIGetCascadePicker',
  2. {
  3. title: 'nihao',//级联选择标题
  4. selectedList:[{"name":"杭州市",subList:[{"name":"上城区"}]}],
  5. list: [
  6. {
  7. name: "杭州市",//条目名称
  8. subList: [
  9. {
  10. name: "西湖区",
  11. subList: [
  12. {
  13. name: "古翠街道"
  14. },
  15. {
  16. name: "文新街道"
  17. }
  18. ]
  19. },
  20. {
  21. name: "上城区",
  22. subList: [
  23. {
  24. name: "延安街道"
  25. },
  26. {
  27. name: "龙翔桥街道"
  28. }
  29. ]
  30. }
  31. ]//级联子数据列表
  32. }
  33. ]//级联数据列表
  34. },
  35. function(result){
  36. console.log(result);
  37. });

入参

名称 类型 描述 必选 默认值 版本
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

代码示例

  1. model = [[AULinkagePickerModel alloc] init];
  2. NSMutableArray *modelList = [[NSMutableArray alloc] init];
  3. for (int i=0; i<6; i++)
  4. {
  5. AULinkagePickerRowItemModel *item = [[AULinkagePickerRowItemModel alloc] init];
  6. item.rowTitle = [NSString stringWithFormat:@"第一层的%d", i];
  7. NSMutableArray *array = [[NSMutableArray alloc] init];
  8. for (int j=0; j<7; j++)
  9. {
  10. if (i == 0)
  11. {
  12. break;
  13. }
  14. AULinkagePickerRowItemModel *item1 = [[AULinkagePickerRowItemModel alloc] init];
  15. item1.rowTitle = [NSString stringWithFormat:@"第二层的%d", j];
  16. NSMutableArray *array1 = [[NSMutableArray alloc] init];
  17. for (int k=0; k<5; k++) {
  18. AULinkagePickerRowItemModel *item2 = [[AULinkagePickerRowItemModel alloc] init];
  19. item2.rowTitle = [NSString stringWithFormat:@"第三层的%d", k];
  20. [array1 addObject:item2];
  21. if (j == 1 || j== 2) {
  22. break;
  23. }
  24. }
  25. item1.rowSubList = array1;
  26. [array addObject:item1];
  27. if (i == 3 || i== 5) {
  28. break;
  29. }
  30. }
  31. item.rowSubList = array;
  32. [modelList addObject:item];
  33. }
  34. model.dataList = modelList;
  35. AULinkagePickerSelectedRowItem *item = [[AULinkagePickerSelectedRowItem alloc] init];
  36. item.selectedLeftTitle = @"第一层的0";
  37. item.selectedMiddleTitle = @"第二层的0";
  38. item.selectedRightTitle = @"第三层的0";
  39. model.selectedItem = item;
  40. self.linkagePickerView = [[AULinkagePickerView alloc] initWithPickerModel:model];
  41. self.linkagePickerView.linkageDelegate = self;
  42. [self.linkagePickerView show];