docs: update feature docs

This commit is contained in:
Justineo
2021-02-01 14:18:57 +08:00
parent d76554d930
commit f00e011642
10 changed files with 180 additions and 26 deletions

View File

@@ -21,7 +21,10 @@ See [the demos of `Table`](./table#demos).
| `align` | `string=` | - | The alignment of cell content in the column. Supports `left`/`center`/`right`. |
| `span` | `function(number): Object=` | | [^span] |
| `desc` | `string` | - | The description of the column head. |
| `filter-value` | `*` | - | The value of filter condition. `true` is the only value supported for now which indicates the column is filtered. |
| `filter-value` | `*` | - | [^filter-value] |
| `filter-multiple` | `boolean=` | `false` | Whether the built-in filter is multi-select or not. |
| `filter-options` | `Array<Object>` | - | The list of filter options, with items of type `{label, value, options, disabled, ...}`, see the `options` prop of the [`Select`](./select) component. |
| `filter-title` | `string=` | - | The title of the filter dropdown. |
^^^sortable
Whether current column is sortable.
@@ -39,6 +42,14 @@ You can learn more abut how to use this in `Table` component's [Demos Advanc
:::
^^^
^^^filter-value
:::badges
`.sync`
:::
The value of current filter condition. `null` means not filtered. When `filter-multiple` is `true`, the value is an array of selected values.
^^^
### Slots
| Name | Description |

View File

@@ -103,6 +103,7 @@ Whether the dropdown menu is expanded.
| `group-label` | [^slot-group-label] |
| `option-label` | [^slot-option-label] |
| `option` | [^slot-option] |
| `trigger` | [^slot-trigger] |
^^^slot-label
The content of the select button. Displays the `label` prop by default.
@@ -157,6 +158,27 @@ The entire content area of each option (option without child `options`). Display
Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
^^^
^^^slot-trigger
The entire drop-down trigger area. Displays the dropdown button by default.
+++Scope properties
| Name | Type | Description |
| --- | --- | --- |
| `attrs` | `Object` | Attributes that need to be output to the trigger element, including `aria-*`/`disabled`, etc., can be output using `v-bind="attrs"`. |
| `handlers` | `Object` | [^handlers-desc] |
| `expanded` | `boolean` | Whether the dropdown menu is expanded or not. |
| `toggle` | `function(force?: boolean): void` | Used to toggle the expanded state of the dropdown menu. |
+++
^^^
^^^^handlers-desc
Event listeners that need to be bound to the trigger element, can be output using `v-on="handlers"`.
:::tip
The element used to bind `handlers` needs to support focus acquisition so that various keyboard interactions can still be triggered properly.
:::
^^^
### Events
| Name | Description |

View File

@@ -19,6 +19,7 @@
| `decimal-place` | `number` | `0` | Decimal place for the progress value. |
| `status` | `string` | - | [^status] |
| `autosucceed` | `boolean|number` | - | Whether automatically enter the `success` status when the progress reaches the maximum value. `true` denotes entering immediately, while `number` values denotes the delay in milliseconds before entering the `success` status. |
| `indeterminate` | `boolean` | `false` | Whether the progress is indeterminate. Currently only works when `type` is `bar`. |
^^^ui
Style variants.

View File

@@ -96,12 +96,26 @@ Whether the dropdown menu is expanded.
| Name | Description |
| -- | -- |
| `default` | The content of the options dropdown layer. Can be used to place `Option`s or `OptionGroups`s when the `options` prop is not specified. |
| `before` | The content before the options in the dropdown layer. |
| `after` | The content after the options in the dropdown layer. |
| `before` | [^slot-before] |
| `after` | The content after the options in the dropdown layer. No default content. |
| `label` | [^slot-label] |
| `group-label` | [^slot-group-label] |
| `option-label` | [^slot-option-label] |
| `option` | [^slot-option] |
| `trigger` | [^slot-trigger] |
^^^slot-before
The content before the options in the dropdown layer. No default content.
+++Scope properties
| Name | Type | Description |
| -- | -- | -- |
| `value` | `*` | The value of the selected option. |
| `select` | `function(value: *): void` | To select a specified value. |
| `expanded` | `boolean` | Whether the dropdown menu is expanded or not. |
| `toggle` | `function(force?: boolean): void` | Used to toggle the expanded state of the dropdown menu. |
+++
^^^
^^^slot-label
The content of the select button. Displays the `label` of selected option or the text content of the selected embedded option by default.
@@ -161,6 +175,29 @@ The entire content area of each option (option without child `options`). Display
Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
^^^
^^^slot-trigger
The entire drop-down trigger area. Displays the select input by default.
+++Scope properties
| Name | Type | Description |
| --- | --- | --- |
| `attrs` | `Object` | Attributes that need to be output to the trigger element, including `aria-*`/`disabled`, etc., can be output using `v-bind="attrs"`. |
| `value` | `*` | The value of the selected option. |
| `select` | `function(value: *): void` | To select a specified value. |
| `handlers` | `Object` | [^handlers-desc] |
| `expanded` | `boolean` | Whether the dropdown menu is expanded or not. |
| `toggle` | `function(force?: boolean): void` | Used to toggle the expanded state of the dropdown menu. |
+++
^^^
^^^^handlers-desc
Event listeners that need to be bound to the trigger element, can be output using `v-on="handlers"`.
:::tip
The element used to bind `handlers` needs to support focus acquisition so that various keyboard interactions can still be triggered properly.
:::
^^^
### Events
| Name | Description |

View File

@@ -23,6 +23,7 @@ Set the `type` prop to `image` to use the image upload mode.
| `ui` | `string=` | - | [^ui] |
| `type` | `string` | `'file'` | [^type] |
| `value` | `Object|Array<Object>` | - | [^value] |
| `key-field` | `string` | `'key'` | Used to specify a unique key for the file object, as a basis for correctly handling the order of the file list when the data changes. |
| `name` | `string` | `'file'` | The `name` of native `<input>` elements. |
| `action` | `string` | - | Upload URL. |
| `headers` | `Object` | `uploader.headers` | Extra [HTTP headers](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers). Can be globally configured. |
@@ -43,6 +44,17 @@ Set the `type` prop to `image` to use the image upload mode.
| `upload` | `function(Object, Object): function` | - | [^upload] |
| `controls` | `function(Object, Array<Object>): Array<Object>` | - | [^controls] |
^^^ui
Style variants.
+++Enum values
| Value | Description |
| -- | -- |
| `s` | Small. |
| `m` | Medium. |
+++
^^^
^^^type
The type of the uploader.
@@ -55,11 +67,7 @@ The type of the uploader.
^^^
^^^value
+++Type details
| `max-count` | Type |
| -- | -- |
| `1` | `Object` |
| > `1`, or `null` | `Array<Object>` |
Returns an array of file objects when `multiple` is `true`. When `max-count` is set to a value greater than `1`, then `multiple` treated as `true`.
The type of single file is `{name: string, src: string, ...}`, and fields added inside `convert-response`.
+++
@@ -113,16 +121,6 @@ Additional fields can be added to the response data. These data fields will be i
+++
^^^
^^^ui
Style variants.
+++Enum values
| Value | Description |
| -- | -- |
| `horizontal` | Horizontal style. |
+++
^^^
^^^progress
To specify how to display progress when `request-mode` is `xhr`.