mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-30 11:07:52 +08:00
combo 支持 placeholder
This commit is contained in:
parent
54a9a4e368
commit
5f4444b464
@ -1,4 +1,8 @@
|
||||
.#{$ns}Combo {
|
||||
&-placeholder {
|
||||
color: $text--muted-color;
|
||||
}
|
||||
|
||||
&-toolbarBtn {
|
||||
line-height: $Combo-toolbarBtn-lineHeight;
|
||||
height: $Combo-toolbarBtn-height;
|
||||
@ -105,6 +109,12 @@
|
||||
> .#{$ns}Combo-items {
|
||||
margin: (-$Combo--vertical-item-gap * 2) (-$Combo--vertical-item-gap * 2)
|
||||
0 (-$Combo--vertical-item-gap * 2);
|
||||
|
||||
> .#{$ns}Combo-placeholder {
|
||||
padding: ($Combo--vertical-item-gap * 2) ($Combo--vertical-item-gap * 2)
|
||||
0 ($Combo--vertical-item-gap * 2);
|
||||
margin-bottom: $Combo--vertical-item-gap * 2;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$ns}Combo-itemTag {
|
||||
|
@ -94,7 +94,8 @@ export default class ComboControl extends React.Component<ComboProps> {
|
||||
dragIcon: 'glyphicon glyphicon-sort',
|
||||
deleteIcon: 'glyphicon glyphicon-remove',
|
||||
tabsMode: false,
|
||||
tabsStyle: ''
|
||||
tabsStyle: '',
|
||||
placeholder: '<空>'
|
||||
};
|
||||
static propsList: Array<string> = [
|
||||
'minLength',
|
||||
@ -865,7 +866,8 @@ export default class ComboControl extends React.Component<ComboProps> {
|
||||
noBorder,
|
||||
conditions,
|
||||
lazyLoad,
|
||||
changeImmediately
|
||||
changeImmediately,
|
||||
placeholder
|
||||
} = this.props;
|
||||
|
||||
let controls = this.props.controls;
|
||||
@ -890,7 +892,7 @@ export default class ComboControl extends React.Component<ComboProps> {
|
||||
)}
|
||||
>
|
||||
<div className={cx(`Combo-items`)}>
|
||||
{Array.isArray(value)
|
||||
{Array.isArray(value) && value.length
|
||||
? value.map((value, index, thelist) => {
|
||||
const toolbar: Array<any> = [];
|
||||
|
||||
@ -1011,7 +1013,9 @@ export default class ComboControl extends React.Component<ComboProps> {
|
||||
</div>
|
||||
);
|
||||
})
|
||||
: null}
|
||||
: placeholder ? (
|
||||
<div className={cx(`Combo-placeholder`)}>{placeholder}</div>
|
||||
) : null}
|
||||
</div>
|
||||
{!disabled ? (
|
||||
<div className={cx(`Combo-toolbar`)}>
|
||||
|
Loading…
Reference in New Issue
Block a user