taolin/docs_vue2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: add link for individual props/events/slots/configs/icons

Browse Source
This commit is contained in:
Justineo
2021-10-20 01:11:27 +08:00
parent df2b6892d2
commit b0dcdbb873
162 changed files with 2176 additions and 2073 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
one/docs/en-US/components/slider.md
View File

@@ -4,13 +4,13 @@
### Size variants
Available size variants for the `ui` prop: `s`/`m`.
Available size variants for the [`ui`](#props-ui) prop: `s` / `m`.
[[ demo src="/demo/slider/size.vue" ]]
### Read-only/disabled
Use the `readonly` prop to set a slider read-only. Use the `disabled` prop to set a slider disabled.
Use the [`readonly`](#props-readonly) prop to set a slider read-only. Use the [`disabled`](#props-disabled) prop to set a slider disabled.
[[ demo src="/demo/slider/editable.vue" ]]
@@ -22,19 +22,19 @@ Use the `step` to make value change by specified step value when clicking spinne
### Range
Use the `max`/`min` props to specify the values at both ends of the slider.
Use the [`max`](#props-max) / [`min`](#props-min) props to specify the values at both ends of the slider.
[[ demo src="/demo/slider/range.vue" ]]
### Secondary bar
Use the `secondary-progress` prop to specify a secondary progress bar.
Use the [`secondary-progress`](#props-secondary-progress) prop to specify a secondary progress bar.
[[ demo src="/demo/slider/buffer.vue" ]]
### Customization
Use the `thumb`/`tip` slots to customize the content of slider thumb and tooltip.
Use the [`thumb`](#slots-thumb) / [`tip`](#slots-tip) slots to customize the content of slider thumb and tooltip.
[[ demo src="/demo/slider/variant.vue" ]]
@@ -44,15 +44,15 @@ Use the `thumb`/`tip` slots to customize the content of slider thumb and tooltip
| Name | Type | Default | Description |
| -- | -- | -- | -- |
| `ui` | `string=` | - | [^ui] |
| `value` | `*|Array<*>` | - | [^value] |
| `secondary-progress` | `number|Array<number>` | `0` | Secondary progress value. |
| `min` | `number` | `0` | The minimun value after `value` is processed by the `parse` function. |
| `max` | `number` | `1` | The maximum value after `value` is processed by the `parse` function. |
| `step` | `number` | `0` | The step value after `value` is processed by the `parse` function. |
| `mark` | `boolean` | `false` | Whether to display step marks. |
| `parse` | `function` | `val => val` | The parse function to transform input value. |
| `format` | `function` | `val => val` | The format function to transform output value. |
| ``ui`` | `string=` | - | [^ui] |
| ``value`` | `*|Array<*>` | - | [^value] |
| ``secondary-progress`` | `number | Array<number>` | `0` | Secondary progress value. |
| ``min`` | `number` | `0` | The minimun value after `value` is processed by the `parse` function. |
| ``max`` | `number` | `1` | The maximum value after `value` is processed by the `parse` function. |
| ``step`` | `number` | `0` | The step value after `value` is processed by the `parse` function. |
| ``mark`` | `boolean` | `false` | Whether to display step marks. |
| ``parse`` | `function` | `val => val` | The parse function to transform input value. |
| ``format`` | `function` | `val => val` | The format function to transform output value. |
^^^ui
Style variants.
@@ -73,7 +73,7 @@ By default the type is `number` and the value should between `min` and `max` aft
When being the type of `Array<number>`, multiple thumbs will be rendered corresponding to each value.
:::tip
When `parse` and `format` are specified, values can be of any type, and `parse` should transform the value to `number` and `format` should transform the value to the same type as the `value` prop. `parse` and `format` only need to take care of single values instead of arrays and the component itself will apply transformation on multiple values if necessary.
When `parse` and `format` are specified, values can be of any type, and `parse` should transform the value to `number` and `format` should transform the value to the same type as the [`value`](#props-value) prop. `parse` and `format` only need to take care of single values instead of arrays and the component itself will apply transformation on multiple values if necessary.
:::
^^^
@@ -81,10 +81,10 @@ When `parse` and `format` are specified, values can be of any type, and `parse`
| Name | Description |
| -- | -- |
| `track` | The track of the slider. Displays a bar by default. |
| `tip-label` | The tooltip content. Displays the current `value` or its item by default. |
| `thumb` | [^slot-thumb] |
| `tip` | [^slot-tip] |
| ``track`` | The track of the slider. Displays a bar by default. |
| ``tip-label`` | The tooltip content. Displays the current `value` or its item by default. |
| ``thumb`` | [^slot-thumb] |
| ``tip`` | [^slot-tip] |
^^^slot-thumb
The thumb(s) of the slider. Displays a round button by default.
@@ -115,7 +115,7 @@ The entire tooltip for each thumb. Displays a `Tooltip` component with `value` a
| Name | Description |
| -- | -- |
| `input` | [^event-input] |
| ``input`` | [^event-input] |
^^^event-input
:::badges