Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(docs): [autocomplete] [affix] #10443

Merged
merged 1 commit into from Nov 5, 2022
Merged

fix(docs): [autocomplete] [affix] #10443

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
28 changes: 14 additions & 14 deletions docs/en-US/component/affix.md
View file
Open in desktop
Expand Up @@ -41,26 +41,26 @@ affix/fixed

### Affix Attributes

| Name | Description | Type | Default | Required |
| ---------- | -------------------------------- | ---------------------------------------- | ------- | -------- |
| `offset` | offset distance. | `number` | `0` | No |
| `position` | position of affix. | <EnumType :values="['top', 'bottom']" /> | `'top'` | No |
| `target` | target container. (CSS selector) | `string` | — | No |
| `z-index` | `z-index` of affix | `number` | `100` | No |
| Name | Description | Type | Default | Required |
| ---------- | -------------------------------- | -------------------------- | ------- | -------- |
| `offset` | offset distance. | ^[number] | `0` | No |
| `position` | position of affix. | ^[enum]`'top' \| 'bottom'` | `'top'` | No |
| `target` | target container. (CSS selector) | ^[string] | — | No |
| `z-index` | `z-index` of affix | ^[number] | `100` | No |

### Affix Events

| Name | Description | Type |
| -------- | ---------------------------------- | ------------------------------------------------------------------------------- |
| `change` | triggers when fixed state changed. | <FunctionType :params="[['fixed', 'boolean']]" /> |
| `scroll` | triggers when scrolling. | <FunctionType :params="[['value', '{ scrollTop: number, fixed: boolean }']]" /> |
| Name | Description | Type |
| -------- | ---------------------------------- | ------------------------------------------------------------------- |
| `change` | triggers when fixed state changed. | ^[Function]`(fixed: boolean) => void` |
| `scroll` | triggers when scrolling. | ^[Function]`(value: { scrollTop: number, fixed: boolean }) => void` |

### Affix Exposes

| Method | Description | Type |
| ------------ | --------------------------- | ---------------- |
| `update` | update affix state manually | <FunctionType /> |
| `updateRoot` | update rootRect info | <FunctionType /> |
| Method | Description | Type |
| ------------ | --------------------------- | ----------------------- |
| `update` | update affix state manually | ^[Function]`() => void` |
| `updateRoot` | update rootRect info | ^[Function]`() => void` |

### Affix Slots

Expand Down
92 changes: 38 additions & 54 deletions docs/en-US/component/autocomplete.md
View file
Open in desktop
Expand Up @@ -41,35 +41,29 @@ autocomplete/remote-search

### Attributes

```api

| Name | Description | Type | Default |
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | ------------ |
| placeholder | the placeholder of Autocomplete | <StringType /> | — |
| clearable | whether to show clear button | <BooleanType /> | false |
| disabled | whether Autocomplete is disabled | <BooleanType /> | false |
| value-key | key name of the input suggestion object for display | <StringType /> | value |
| model-value / v-model | binding value | <StringType /> | — |
| debounce | debounce delay when typing, in milliseconds | <NumberType /> | 300 |
| placement | placement of the popup menu | <EnumType :values="['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end']" /> | bottom-start |
| fetch-suggestions | a method to fetch input suggestions. When suggestions are ready, invoke `callback(data:[])` to return them to Autocomplete | <FunctionType :params="[['queryString', 'string'], ['callback', 'CallbackFn']]" /> | — |
| popper-class | custom class name for autocomplete's dropdown | <StringType /> | — |
| trigger-on-focus | whether show suggestions when input focus | <BooleanType /> | true |
| name | same as `name` in native input | <StringType /> | — |
| select-when-unmatched | whether to emit a `select` event on enter when there is no autocomplete match | <BooleanType /> | false |
| label | label text | <StringType /> | — |
| hide-loading | whether to hide the loading icon in remote search | <BooleanType /> | false |
| popper-append-to-body(deprecated) | whether to append the dropdown to body. If the positioning of the dropdown is wrong, you can try to set this prop to false | <BooleanType /> | false |
| teleported | whether select dropdown is teleported to the body | <BooleanType /> | true |
| highlight-first-item | whether to highlight first item in remote search suggestions by default | <BooleanType /> | false |
| fit-input-width | whether the width of the dropdown is the same as the input | <BooleanType /> | false |

```
| Name | Description | Type | Default |
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------- | ------------ |
| placeholder | the placeholder of Autocomplete | ^[string] | — |
| clearable | whether to show clear button | ^[boolean] | false |
| disabled | whether Autocomplete is disabled | ^[boolean] | false |
| value-key | key name of the input suggestion object for display | ^[string] | value |
| model-value / v-model | binding value | ^[string] | — |
| debounce | debounce delay when typing, in milliseconds | ^[number] | 300 |
| placement | placement of the popup menu | ^[enum]`'top' \| 'top- start' \| 'top-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end'` | bottom-start |
| fetch-suggestions | a method to fetch input suggestions. When suggestions are ready, invoke `callback(data:[])` to return them to Autocomplete | ^[Function]`(queryString': string, callback: callbackfn) => void` | — |
jw-foss marked this conversation as resolved.
Show resolved Hide resolved
| popper-class | custom class name for autocomplete's dropdown | ^[string] | — |
| trigger-on-focus | whether show suggestions when input focus | ^[boolean] | true |
| name | same as `name` in native input | ^[string] | — |
| select-when-unmatched | whether to emit a `select` event on enter when there is no autocomplete match | ^[boolean] | false |
| label | label text | ^[string] | — |
| hide-loading | whether to hide the loading icon in remote search | ^[boolean] | false |
| popper-append-to-body(deprecated) | whether to append the dropdown to body. If the positioning of the dropdown is wrong, you can try to set this prop to false | ^[boolean] | false |
| teleported | whether select dropdown is teleported to the body | ^[boolean] | true |
| highlight-first-item | whether to highlight first item in remote search suggestions by default | ^[boolean] | false |
| fit-input-width | whether the width of the dropdown is the same as the input | ^[boolean] | false |

### Slots

```api

| Name | Description |
| ------- | --------------------------------------------------------------------- |
| default | Custom content for input suggestions. The scope parameter is { item } |
Expand All @@ -78,36 +72,26 @@ autocomplete/remote-search
| prepend | content to prepend before Input |
| append | content to append after Input |

```

### Events

```api

| Name | Description | Type |
| ------ | ------------------------------------------------ | ------------------------------------------------------------------------------ |
| select | triggers when a suggestion is clicked | <FunctionType :params="[['item', ['{ value: typeof modelValue }', 'any']]]" /> |
| change | triggers when the icon inside Input value change | <FunctionType :params="[['value', ['string', 'number']]]" /> |

```
| Name | Description | Type |
| ------ | ------------------------------------------------ | ----------------------------------------------------- |
| select | triggers when a suggestion is clicked | ^[Function]`(item: typeof modelValue \| any) => void` |
| change | triggers when the icon inside Input value change | ^[Function]`(value: string \| number) => void` |

### Instance Exposes

```api

| Name | Description | Type |
| ---------------- | ------------------------------------------- | -------------------------------------------------------------------- |
| activated | if autocomplete activated | <RefType type="boolean" /> |
| blur | blur the input element | <FunctionType /> |
| close | collapse suggestion list | <FunctionType /> |
| focus | focus the input element | <FunctionType /> |
| handleSelect | triggers when a suggestion is clicked | <FunctionType :params="[['item', 'any']]" returns="Promise<void>" /> |
| handleKeyEnter | handle keyboard enter event | <FunctionType returns="Promise<void>" /> |
| highlightedIndex | the index of the currently highlighted item | <RefType type="number" /> |
| highlight | highlight an item in a suggestion | <FunctionType :params="[['itemIndex', 'number']]" /> |
| inputRef | el-input component instance | <RefType type="ElInputInstance" /> |
| loading | remote search loading indicator | <RefType type="boolean" /> |
| popperRef | el-tooltip component instance | <RefType type="ElTooltipInstance" /> |
| suggestions | fetch suggestions result | <RefType type="Record<string, any>" /> |

```
| Name | Description | Type |
| ---------------- | ------------------------------------------- | ----------------------------------------- |
| activated | if autocomplete activated | ^[Object]`Ref<boolean>` |
| blur | blur the input element | ^[Function]`() => void` |
| close | collapse suggestion list | ^[Function]`() => void` |
| focus | focus the input element | ^[Function]`() => void` |
| handleSelect | triggers when a suggestion is clicked | ^[Function]`(item: any) => promise<void>` |
| handleKeyEnter | handle keyboard enter event | ^[Function]`() => promise<void>` |
| highlightedIndex | the index of the currently highlighted item | ^[Object]`Ref<number>` |
| highlight | highlight an item in a suggestion | ^[Function]`(itemIndex: number) => void` |
| inputRef | el-input component instance | ^[Object]`Ref<ElInputInstance>` |
| loading | remote search loading indicator | ^[Object]`Ref<boolean>` |
| popperRef | el-tooltip component instance | ^[Object]`Ref<ElTooltipInstance>` |
| suggestions | fetch suggestions result | ^[Object]`Ref<record<string, any>>` |