mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
feat: Transfer 系列 LeftOptions 可以支持动态加载 (#2974)
* feat: Transfer 系列 LeftOptions 可以支持动态加载 * 补充文档
This commit is contained in:
parent
eb38a50763
commit
1393b4ea7c
@ -869,6 +869,24 @@ _多选_
|
||||
}
|
||||
```
|
||||
|
||||
leftOptions 动态加载,默认 source 接口是返回 options 部分,而 leftOptions 是没有对应的接口可以动态返回了。为了方便,目前如果 source 接口返回的选中中,第一个 option 是以下这种格式则也会把 options[0].leftOptions 当成 leftOptions, options[0].children 当 options。同时 options[0].leftDefaultValue 可以用来配置左侧选项的默认值。
|
||||
|
||||
```
|
||||
{
|
||||
status: 0,
|
||||
msg: '',
|
||||
data: {
|
||||
options: [
|
||||
{
|
||||
leftOptions: [],
|
||||
children: [],
|
||||
leftDefaultValue: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## searchApi
|
||||
|
||||
**发送**
|
||||
|
@ -506,6 +506,24 @@ icon:
|
||||
}
|
||||
```
|
||||
|
||||
leftOptions 动态加载,默认 source 接口是返回 options 部分,而 leftOptions 是没有对应的接口可以动态返回了。为了方便,目前如果 source 接口返回的选中中,第一个 option 是以下这种格式则也会把 options[0].leftOptions 当成 leftOptions, options[0].children 当 options。同时 options[0].leftDefaultValue 可以用来配置左侧选项的默认值。
|
||||
|
||||
```
|
||||
{
|
||||
status: 0,
|
||||
msg: '',
|
||||
data: {
|
||||
options: [
|
||||
{
|
||||
leftOptions: [],
|
||||
children: [],
|
||||
leftDefaultValue: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## searchApi
|
||||
|
||||
**发送**
|
||||
|
@ -42,7 +42,7 @@ export class BaseSelection<
|
||||
placeholder: 'placeholder.noOption',
|
||||
itemRender: (option: Option) => <span>{option.label}</span>,
|
||||
multiple: true,
|
||||
clearable: true
|
||||
clearable: false
|
||||
};
|
||||
|
||||
static value2array(
|
||||
|
@ -351,7 +351,6 @@ class TransferDropdownRenderer extends BaseTransferRenderer<TransferDropDownProp
|
||||
const {
|
||||
className,
|
||||
classnames: cx,
|
||||
options,
|
||||
selectedOptions,
|
||||
sortable,
|
||||
loading,
|
||||
@ -363,11 +362,26 @@ class TransferDropdownRenderer extends BaseTransferRenderer<TransferDropDownProp
|
||||
selectTitle,
|
||||
selectMode,
|
||||
multiple,
|
||||
leftMode,
|
||||
leftOptions,
|
||||
columns
|
||||
columns,
|
||||
leftMode
|
||||
} = this.props;
|
||||
|
||||
// 目前 LeftOptions 没有接口可以动态加载
|
||||
// 为了方便可以快速实现动态化,让选项的第一个成员携带
|
||||
// LeftOptions 信息
|
||||
let {options, leftOptions, leftDefaultValue} = this.props;
|
||||
if (
|
||||
selectMode === 'associated' &&
|
||||
options &&
|
||||
options.length === 1 &&
|
||||
options[0].leftOptions &&
|
||||
Array.isArray(options[0].children)
|
||||
) {
|
||||
leftOptions = options[0].leftOptions;
|
||||
leftDefaultValue = options[0].leftDefaultValue ?? leftDefaultValue;
|
||||
options = options[0].children;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<TransferDropDown
|
||||
|
@ -249,7 +249,6 @@ export class BaseTransferRenderer<
|
||||
const {
|
||||
className,
|
||||
classnames: cx,
|
||||
options,
|
||||
selectedOptions,
|
||||
showArrow,
|
||||
sortable,
|
||||
@ -260,7 +259,6 @@ export class BaseTransferRenderer<
|
||||
searchResultMode,
|
||||
searchResultColumns,
|
||||
deferLoad,
|
||||
leftOptions,
|
||||
leftMode,
|
||||
rightMode,
|
||||
disabled,
|
||||
@ -270,6 +268,22 @@ export class BaseTransferRenderer<
|
||||
resultItemRender
|
||||
} = this.props;
|
||||
|
||||
// 目前 LeftOptions 没有接口可以动态加载
|
||||
// 为了方便可以快速实现动态化,让选项的第一个成员携带
|
||||
// LeftOptions 信息
|
||||
let {options, leftOptions, leftDefaultValue} = this.props;
|
||||
if (
|
||||
selectMode === 'associated' &&
|
||||
options &&
|
||||
options.length === 1 &&
|
||||
options[0].leftOptions &&
|
||||
Array.isArray(options[0].children)
|
||||
) {
|
||||
leftOptions = options[0].leftOptions;
|
||||
leftDefaultValue = options[0].leftDefaultValue ?? leftDefaultValue;
|
||||
options = options[0].children;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={cx('TransferControl', className)}>
|
||||
<Transfer
|
||||
|
@ -78,7 +78,6 @@ export class TransferPickerRenderer extends BaseTransferRenderer<TabsTransferPro
|
||||
const {
|
||||
className,
|
||||
classnames: cx,
|
||||
options,
|
||||
selectedOptions,
|
||||
sortable,
|
||||
loading,
|
||||
@ -92,12 +91,29 @@ export class TransferPickerRenderer extends BaseTransferRenderer<TabsTransferPro
|
||||
pickerSize,
|
||||
columns,
|
||||
leftMode,
|
||||
leftOptions
|
||||
selectMode
|
||||
} = this.props;
|
||||
|
||||
// 目前 LeftOptions 没有接口可以动态加载
|
||||
// 为了方便可以快速实现动态化,让选项的第一个成员携带
|
||||
// LeftOptions 信息
|
||||
let {options, leftOptions, leftDefaultValue} = this.props;
|
||||
if (
|
||||
selectMode === 'associated' &&
|
||||
options &&
|
||||
options.length === 1 &&
|
||||
options[0].leftOptions &&
|
||||
Array.isArray(options[0].children)
|
||||
) {
|
||||
leftOptions = options[0].leftOptions;
|
||||
leftDefaultValue = options[0].leftDefaultValue ?? leftDefaultValue;
|
||||
options = options[0].children;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={cx('TabsTransferControl', className)}>
|
||||
<div className={cx('TransferControl', className)}>
|
||||
<TransferPicker
|
||||
selectMode={selectMode}
|
||||
value={selectedOptions}
|
||||
disabled={disabled}
|
||||
options={options}
|
||||
|
Loading…
Reference in New Issue
Block a user