mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2024-11-27 02:01:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(components): [select] add offset and show-arrow prop (#18837)

Browse Source 
feat: add show-arrow prop to control dropdown arrow visibility
This commit is contained in:
DDDDD12138 2024-11-11 17:10:48 +08:00 committed by GitHub
parent ffb30818cf
commit 4f04bcd46f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 36 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/en-US/component/select-v2.md
View File

@ -254,6 +254,8 @@ select-v2/custom-label
| remote | whether search data from server | ^[boolean] | false | | remote | whether search data from server | ^[boolean] | false |
| remote-method | function that gets called when the input value changes. Its parameter is the current input value. To use this, `filterable` must be true | ^[Function]`(keyword: string) => void` | — | | remote-method | function that gets called when the input value changes. Its parameter is the current input value. To use this, `filterable` must be true | ^[Function]`(keyword: string) => void` | — |
| validate-event | whether to trigger form validation | ^[boolean] | true | | validate-event | whether to trigger form validation | ^[boolean] | true |
| offset ^(2.8.8) | offset of the dropdown | ^[number] | 12 |
| show-arrow ^(2.8.8) | whether the dropdown has an arrow | ^[boolean] | true |
| placement | position of dropdown | ^[enum]`'top' \| 'top-start' \| 'top-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end' \| 'right' \| 'right-start' \| 'right-end'` | bottom-start | | placement | position of dropdown | ^[enum]`'top' \| 'top-start' \| 'top-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end' \| 'right' \| 'right-start' \| 'right-end'` | bottom-start |
| fallback-placements ^(2.5.6) | list of possible positions for dropdown [popper.js](https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements) | ^[array]`Placement[]` | ['bottom-start', 'top-start', 'right', 'left'] | | fallback-placements ^(2.5.6) | list of possible positions for dropdown [popper.js](https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements) | ^[array]`Placement[]` | ['bottom-start', 'top-start', 'right', 'left'] |
| collapse-tags-tooltip ^(2.3.0) | whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true | ^[boolean] | false | | collapse-tags-tooltip ^(2.3.0) | whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true | ^[boolean] | false |

2
docs/en-US/component/select.md
View File

@ -223,6 +223,8 @@ select/custom-label
| tag-type | tag type | ^[enum]`'' \| 'success' \| 'info' \| 'warning' \| 'danger'` | info | | tag-type | tag type | ^[enum]`'' \| 'success' \| 'info' \| 'warning' \| 'danger'` | info |
| tag-effect ^(2.7.7) | tag effect | ^[enum]`'' \| 'light' \| 'dark' \| 'plain'` | light | | tag-effect ^(2.7.7) | tag effect | ^[enum]`'' \| 'light' \| 'dark' \| 'plain'` | light |
| validate-event | whether to trigger form validation | ^[boolean] | true | | validate-event | whether to trigger form validation | ^[boolean] | true |
| offset ^(2.8.8) | offset of the dropdown | ^[number] | 12 |
| show-arrow ^(2.8.8) | whether the dropdown has an arrow | ^[boolean] | true |
| placement ^(2.2.17) | position of dropdown | ^[enum]`'top' \| 'top-start' \| 'top-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end' \| 'right' \| 'right-start' \| 'right-end'` | bottom-start | | placement ^(2.2.17) | position of dropdown | ^[enum]`'top' \| 'top-start' \| 'top-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end' \| 'right' \| 'right-start' \| 'right-end'` | bottom-start |
| fallback-placements ^(2.5.6) | list of possible positions for dropdown [popper.js](https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements) | ^[array]`Placement[]` | ['bottom-start', 'top-start', 'right', 'left'] | | fallback-placements ^(2.5.6) | list of possible positions for dropdown [popper.js](https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements) | ^[array]`Placement[]` | ['bottom-start', 'top-start', 'right', 'left'] |
| max-collapse-tags ^(2.3.0) | the max tags number to be shown. To use this, `collapse-tags` must be true | ^[number] | 1 | | max-collapse-tags ^(2.3.0) | the max tags number to be shown. To use this, `collapse-tags` must be true | ^[number] | 1 |

14
packages/components/select-v2/src/defaults.ts
View File

@ -237,6 +237,20 @@ export const SelectProps = buildProps({
type: Boolean, type: Boolean,
default: true, default: true,
}, },
/**
* @description offset of the dropdown
*/
offset: {
type: Number,
default: 12,
},
/**
* @description Determines whether the arrow is displayed
*/
showArrow: {
type: Boolean,
default: true,
},
/** /**
* @description position of dropdown * @description position of dropdown
*/ */

2
packages/components/select-v2/src/select.vue
View File

@ -22,6 +22,8 @@
trigger="click" trigger="click"
:persistent="persistent" :persistent="persistent"
:append-to="appendTo" :append-to="appendTo"
:show-arrow="showArrow"
:offset="offset"
@before-show="handleMenuEnter" @before-show="handleMenuEnter"
@hide="states.isBeforeHide = false" @hide="states.isBeforeHide = false"
> >

14
packages/components/select/src/select.ts
View File

@ -209,6 +209,20 @@ export const SelectProps = buildProps({
* @description in remote search method show suffix icon * @description in remote search method show suffix icon
*/ */
remoteShowSuffix: Boolean, remoteShowSuffix: Boolean,
/**
* @description determines whether the arrow is displayed
*/
showArrow: {
type: Boolean,
default: true,
},
/**
* @description offset of the dropdown
*/
offset: {
type: Number,
default: 12,
},
/** /**
* @description position of dropdown * @description position of dropdown
*/ */

2
packages/components/select/src/select.vue
View File

@ -22,6 +22,8 @@
:gpu-acceleration="false" :gpu-acceleration="false"
:persistent="persistent" :persistent="persistent"
:append-to="appendTo" :append-to="appendTo"
:show-arrow="showArrow"
:offset="offset"
@before-show="handleMenuEnter" @before-show="handleMenuEnter"
@hide="states.isBeforeHide = false" @hide="states.isBeforeHide = false"
> >