chore: format code (#14037)

This commit is contained in:
btea 2023-08-23 10:33:16 +08:00 committed by GitHub
parent 9cee96751c
commit c6515e09c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 57 additions and 57 deletions

View File

@ -123,46 +123,46 @@ select/value-key
### Select Attributes
| Name | Description | Type | Default |
| ----------------------------------- | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------- |
| model-value / v-model | binding value | ^[string] / ^[number] / ^[boolean] / ^[object] / ^[array] | — |
| multiple | whether multiple-select is activated | ^[boolean] | false |
| disabled | whether Select is disabled | ^[boolean] | false |
| value-key | unique identity key name for value, required when value is an object | ^[string] | value |
| size | size of Input | ^[enum]`'' \| 'large' \| 'default' \| 'small'` | — |
| clearable | whether select can be cleared | ^[boolean] | false |
| collapse-tags | whether to collapse tags to a text when multiple selecting | ^[boolean] | false |
| collapse-tags-tooltip | whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true | ^[boolean] | false |
| multiple-limit | maximum number of options user can select when `multiple` is `true`. No limit when set to 0 | ^[number] | 0 |
| name | the name attribute of select input | ^[string] | — |
| effect | tooltip theme, built-in theme: `dark` / `light` | ^[enum]`'dark' \| 'light'` / ^[string] | light |
| autocomplete | the autocomplete attribute of select input | ^[string] | off |
| placeholder | placeholder, default is 'Select' | ^[string] | — |
| filterable | whether Select is filterable | ^[boolean] | false |
| allow-create | whether creating new items is allowed. To use this, `filterable` must be true | ^[boolean] | false |
| filter-method | custom filter method | ^[Function]`() => void` | — |
| remote | whether options are loaded from server | ^[boolean] | false |
| remote-method | custom remote search method | ^[Function]`() => void` | — |
| remote-show-suffix | in remote search method show suffix icon | ^[boolean] | false |
| loading | whether Select is loading data from server | ^[boolean] | false |
| loading-text | displayed text while loading data from server, default is 'Loading' | ^[string] | — |
| no-match-text | displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data' | ^[string] | — |
| no-data-text | displayed text when there is no options, you can also use slot `empty`, default is 'No data' | ^[string] | — |
| popper-class | custom class name for Select's dropdown | ^[string] | '' |
| reserve-keyword | when `multiple` and `filter` is true, whether to reserve current keyword after selecting an option | ^[boolean] | true |
| default-first-option | select first matching option on enter key. Use with `filterable` or `remote` | ^[boolean] | false |
| teleported | whether select dropdown is teleported to the body | ^[boolean] | true |
| persistent | when select dropdown is inactive and `persistent` is `false`, select dropdown will be destroyed | ^[boolean] | true |
| automatic-dropdown | for non-filterable Select, this prop decides if the option menu pops up when the input is focused | ^[boolean] | false |
| clear-icon | custom clear icon component | ^[string] / ^[object]`Component` | CircleClose |
| fit-input-width | whether the width of the dropdown is the same as the input | ^[boolean] | false |
| suffix-icon | custom suffix icon component | ^[string] / ^[object]`Component` | ArrowDown |
| suffix-transition ^(deprecated) | animation when dropdown appears/disappears icon | ^[boolean] | true |
| tag-type | tag type | ^[enum]`'' \| 'success' \| 'info' \| 'warning' \| 'danger'` | info |
| validate-event | whether to trigger form validation | ^[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 |
| max-collapse-tags ^(2.3.0) | the max tags number to be shown. To use this, `collapse-tags` must be true | ^[number] | 1 |
| popper-options | [popper.js](https://popper.js.org/docs/v2/) parameters | ^[object]refer to [popper.js](https://popper.js.org/docs/v2/) doc | {} |
| Name | Description | Type | Default |
| ------------------------------- | --------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ |
| model-value / v-model | binding value | ^[string] / ^[number] / ^[boolean] / ^[object] / ^[array] | — |
| multiple | whether multiple-select is activated | ^[boolean] | false |
| disabled | whether Select is disabled | ^[boolean] | false |
| value-key | unique identity key name for value, required when value is an object | ^[string] | value |
| size | size of Input | ^[enum]`'' \| 'large' \| 'default' \| 'small'` | — |
| clearable | whether select can be cleared | ^[boolean] | false |
| collapse-tags | whether to collapse tags to a text when multiple selecting | ^[boolean] | false |
| collapse-tags-tooltip | whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true | ^[boolean] | false |
| multiple-limit | maximum number of options user can select when `multiple` is `true`. No limit when set to 0 | ^[number] | 0 |
| name | the name attribute of select input | ^[string] | — |
| effect | tooltip theme, built-in theme: `dark` / `light` | ^[enum]`'dark' \| 'light'` / ^[string] | light |
| autocomplete | the autocomplete attribute of select input | ^[string] | off |
| placeholder | placeholder, default is 'Select' | ^[string] | — |
| filterable | whether Select is filterable | ^[boolean] | false |
| allow-create | whether creating new items is allowed. To use this, `filterable` must be true | ^[boolean] | false |
| filter-method | custom filter method | ^[Function]`() => void` | — |
| remote | whether options are loaded from server | ^[boolean] | false |
| remote-method | custom remote search method | ^[Function]`() => void` | — |
| remote-show-suffix | in remote search method show suffix icon | ^[boolean] | false |
| loading | whether Select is loading data from server | ^[boolean] | false |
| loading-text | displayed text while loading data from server, default is 'Loading' | ^[string] | — |
| no-match-text | displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data' | ^[string] | — |
| no-data-text | displayed text when there is no options, you can also use slot `empty`, default is 'No data' | ^[string] | — |
| popper-class | custom class name for Select's dropdown | ^[string] | '' |
| reserve-keyword | when `multiple` and `filter` is true, whether to reserve current keyword after selecting an option | ^[boolean] | true |
| default-first-option | select first matching option on enter key. Use with `filterable` or `remote` | ^[boolean] | false |
| teleported | whether select dropdown is teleported to the body | ^[boolean] | true |
| persistent | when select dropdown is inactive and `persistent` is `false`, select dropdown will be destroyed | ^[boolean] | true |
| automatic-dropdown | for non-filterable Select, this prop decides if the option menu pops up when the input is focused | ^[boolean] | false |
| clear-icon | custom clear icon component | ^[string] / ^[object]`Component` | CircleClose |
| fit-input-width | whether the width of the dropdown is the same as the input | ^[boolean] | false |
| suffix-icon | custom suffix icon component | ^[string] / ^[object]`Component` | ArrowDown |
| suffix-transition ^(deprecated) | animation when dropdown appears/disappears icon | ^[boolean] | true |
| tag-type | tag type | ^[enum]`'' \| 'success' \| 'info' \| 'warning' \| 'danger'` | info |
| validate-event | whether to trigger form validation | ^[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 |
| max-collapse-tags ^(2.3.0) | the max tags number to be shown. To use this, `collapse-tags` must be true | ^[number] | 1 |
| popper-options | [popper.js](https://popper.js.org/docs/v2/) parameters | ^[object]refer to [popper.js](https://popper.js.org/docs/v2/) doc | {} |
:::warning
@ -172,14 +172,14 @@ select/value-key
### Select Events
| Name | Description | Type |
| -------------- | ------------------------------------------------------------- | ----------------------------------------- |
| change | triggers when the selected value changes | ^[Function]`(value: any) => void` |
| visible-change | triggers when the dropdown appears/disappears | ^[Function]`(visible: boolean) => void` |
| remove-tag | triggers when a tag is removed in multiple mode | ^[Function]`(tagValue: any) => void` |
| clear | triggers when the clear icon is clicked in a clearable Select | ^[Function]`() => void` |
| blur | triggers when Input blurs | ^[Function]`(event: FocusEvent) => void` |
| focus | triggers when Input focuses | ^[Function]`(event: FocusEvent) => void` |
| Name | Description | Type |
| -------------- | ------------------------------------------------------------- | ---------------------------------------- |
| change | triggers when the selected value changes | ^[Function]`(value: any) => void` |
| visible-change | triggers when the dropdown appears/disappears | ^[Function]`(visible: boolean) => void` |
| remove-tag | triggers when a tag is removed in multiple mode | ^[Function]`(tagValue: any) => void` |
| clear | triggers when the clear icon is clicked in a clearable Select | ^[Function]`() => void` |
| blur | triggers when Input blurs | ^[Function]`(event: FocusEvent) => void` |
| focus | triggers when Input focuses | ^[Function]`(event: FocusEvent) => void` |
### Select Slots
@ -215,11 +215,11 @@ select/value-key
### Option Attributes
| Name | Description | Type | Default |
| -------- | ------------------------------------------- | ------------------------------------------------ | ------- |
| value | value of option | ^[string] / ^[number] / ^[boolean] / ^[object] | — |
| label | label of option, same as `value` if omitted | ^[string] / ^[number] | — |
| disabled | whether option is disabled | ^[boolean] | false |
| Name | Description | Type | Default |
| -------- | ------------------------------------------- | ---------------------------------------------- | ------- |
| value | value of option | ^[string] / ^[number] / ^[boolean] / ^[object] | — |
| label | label of option, same as `value` if omitted | ^[string] / ^[number] | — |
| disabled | whether option is disabled | ^[boolean] | false |
### Option Slots

View File

@ -36,7 +36,7 @@ table-v2/basic
## Auto resizer
When you do not want to manually pass the `width` and `height` properties to the table, you can wrap the table component with the AutoResizer.
When you do not want to manually pass the `width` and `height` properties to the table, you can wrap the table component with the AutoResizer.
This will automatically update the width and height for you.
Resize your browser to see how it works.
@ -222,13 +222,13 @@ table-v2/tree-data
## Dynamic height rows
Virtual Table is capable of rendering rows with dynamic heights. If you're working with data and are uncertain about the content size,
this feature is ideal for rendering rows that adjust to the content's height. To enable this, pass down the `estimated-row-height` attribute.
Virtual Table is capable of rendering rows with dynamic heights. If you're working with data and are uncertain about the content size,
this feature is ideal for rendering rows that adjust to the content's height. To enable this, pass down the `estimated-row-height` attribute.
The closer the estimated height matches the actual content, the smoother the rendering experience.
:::tip
Each row's height is dynamically measured during rendering the rows. As a result, if you're trying to display a large amount of data,
Each row's height is dynamically measured during rendering the rows. As a result, if you're trying to display a large amount of data,
the UI **might be** bouncing.
:::