feat(Select): add title to select option

This commit is contained in:
xzdry 2022-08-08 17:56:17 +08:00
parent 6304215a8b
commit 55dd952d0e
2 changed files with 13 additions and 1 deletions

View File

@ -32,6 +32,7 @@ export const Select = implementRuntimeComponent({
loading: false,
showSearch: false,
unmountOnExit: false,
showTitle: false,
options: [
{ value: 'Beijing', text: 'Beijing' },
{ value: 'London', text: 'London' },
@ -69,6 +70,7 @@ export const Select = implementRuntimeComponent({
options = [],
retainInputValue,
updateWhenDefaultValueChanges,
showTitle,
...cProps
} = getComponentProps(props);
const [value, setValue] = useStateValue(
@ -130,7 +132,12 @@ export const Select = implementRuntimeComponent({
}}
>
{options.map(o => (
<BaseSelect.Option key={o.value} value={o.value} disabled={o.disabled}>
<BaseSelect.Option
key={o.value}
value={o.value}
disabled={o.disabled}
{...(showTitle && { title: o.text || o.value })}
>
{o.text || o.value}
</BaseSelect.Option>
))}

View File

@ -94,6 +94,11 @@ export const SelectPropsSpec = {
category: Category.Behavior,
description: 'Whether to allow new options to be created by input',
}),
showTitle: Type.Boolean({
title: 'Show Option Title',
description:
'Whether to show the title on hover when the select option exceeds the width',
}),
error: Type.Boolean({
title: 'Error',
category: Category.Behavior,