eastedu-chapter-multi-select

init

Usage no npm install needed!

<script type="module">
  import easteduChapterMultiSelect from 'https://cdn.skypack.dev/eastedu-chapter-multi-select';
</script>

README

章节树多选

用法

import ChapterMultiSelect from './ChapterMultiSelect';

<ChapterTreeSelect
  data={data}
  visible={visible}
  onSelect={onSelect}
  onExpand={onExpand}
  onToggle={(e) => {}}
  expandedKeys={expandedKeys}
  selectedKeys={[]}
/>;

参数


  // 章节数据
  // 必选
  // example:
  //  [{
  //     Guid: "58da7e27-18ae-46cf-931c-c75fc418d73d",
  //     Name: "自定义",
  //     Children: [
  //       {
  //         Guid: "d9ece8fa-04c9-4fe8-8dce-3bee83d4d3be",
  //         Name: "默认文件夹",
  //         Children: [...],
  //       },...
  //     ],...
  //   }]
  data: array,
  visible: boolean, // 必选,弹窗状态
  handleOk: function, // 必选,确认回调
  handleCancel: function, // 必选,取消回调
  // 选中的节点
  // [
  //   {
  //     Guid: '7cdfa0c3-1f8d-4066-ab15-7e6ff8b6a089',
  //     Name: '16 听听那冷雨',
  //     MaterialGuid: 'b641125c-65b2-4d98-8fb5-c37972141b91',
  //     MaterialName: '语文语文版·中国现当代散文鉴赏',
  //   },...
  // ]
  selectedChapters: array,

  title: string | '选择章节',// 非必选,modal title
  width: number | string | 1100,// 非必选,modal width
  radio: boolean | false, // 非必选,单选模式
  minlength: number | 1, // 非必选,最小选择数量
  maxlength: number | 5, // 非必选,最大选择数量
  showChosenList: boolean | true, // 非必选,是否显示选中列
  singleParentChapter: boolean | false, // 非必选,是否选择单个大章节

  // 支持传其他的antd modal 支持的属性
  ...otherProps


D4C21FF6-9C40-41B6-81E8-7259C97B3433.png

E5DDD504-3B44-4E4D-B35C-771632ED1FCF.png