fix: slider marks support function #171
parent
647214c513
commit
2a26caab83
|
@ -7,7 +7,7 @@
|
||||||
| disabled | If true, the slider will not be interactable. | boolean | false |
|
| disabled | If true, the slider will not be interactable. | boolean | false |
|
||||||
| dots | Whether the thumb can drag over tick only. | boolean | false |
|
| dots | Whether the thumb can drag over tick only. | boolean | false |
|
||||||
| included | Make effect when `marks` not null,`true` means containment and `false` means coordinative | boolean | true |
|
| included | Make effect when `marks` not null,`true` means containment and `false` means coordinative | boolean | true |
|
||||||
| marks | Tick mark of Slider, type of key must be `number`, and must in closed interval [min, max] ,each mark can declare its own style. | object | { number: string\|VNode } or { number: { style: object, label: string\|VNode } } |
|
| marks | Tick mark of Slider, type of key must be `number`, and must in closed interval [min, max] ,each mark can declare its own style. | object | { number: string\|VNode } or { number: { style: object, label: string\|VNode } } or { number: () => VNode } |
|
||||||
| max | The maximum value the slider can slide to | number | 100 |
|
| max | The maximum value the slider can slide to | number | 100 |
|
||||||
| min | The minimum value the slider can slide to. | number | 0 |
|
| min | The minimum value the slider can slide to. | number | 0 |
|
||||||
| range | dual thumb mode | boolean | false |
|
| range | dual thumb mode | boolean | false |
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
| disabled | 值为 `true` 时,滑块为禁用状态 | boolean | false |
|
| disabled | 值为 `true` 时,滑块为禁用状态 | boolean | false |
|
||||||
| dots | 是否只能拖拽到刻度上 | boolean | false |
|
| dots | 是否只能拖拽到刻度上 | boolean | false |
|
||||||
| included | `marks` 不为空对象时有效,值为 true 时表示值为包含关系,false 表示并列 | boolean | true |
|
| included | `marks` 不为空对象时有效,值为 true 时表示值为包含关系,false 表示并列 | boolean | true |
|
||||||
| marks | 刻度标记,key 的类型必须为 `number` 且取值在闭区间 [min, max] 内,每个标签可以单独设置样式 | object | { number: string\|VNode } or { number: { style: object, label: string\|VNode } } |
|
| marks | 刻度标记,key 的类型必须为 `number` 且取值在闭区间 [min, max] 内,每个标签可以单独设置样式 | object | { number: string\|VNode } or { number: { style: object, label: string\|VNode } } or { number: () => VNode } |
|
||||||
| max | 最大值 | number | 100 |
|
| max | 最大值 | number | 100 |
|
||||||
| min | 最小值 | number | 0 |
|
| min | 最小值 | number | 0 |
|
||||||
| range | 双滑块模式 | boolean | false |
|
| range | 双滑块模式 | boolean | false |
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { isValidElement } from '../../../_util/props-util'
|
||||||
|
|
||||||
const Marks = {
|
const Marks = {
|
||||||
functional: true,
|
functional: true,
|
||||||
render (createElement, context) {
|
render (h, context) {
|
||||||
const {
|
const {
|
||||||
className,
|
className,
|
||||||
vertical,
|
vertical,
|
||||||
|
@ -22,7 +22,7 @@ const Marks = {
|
||||||
|
|
||||||
const range = max - min
|
const range = max - min
|
||||||
const elements = marksKeys.map(parseFloat).sort((a, b) => a - b).map(point => {
|
const elements = marksKeys.map(parseFloat).sort((a, b) => a - b).map(point => {
|
||||||
const markPoint = marks[point]
|
const markPoint = typeof marks[point] === 'function' ? marks[point](h) : marks[point]
|
||||||
const markPointIsObject = typeof markPoint === 'object' &&
|
const markPointIsObject = typeof markPoint === 'object' &&
|
||||||
!isValidElement(markPoint)
|
!isValidElement(markPoint)
|
||||||
const markLabel = markPointIsObject ? markPoint.label : markPoint
|
const markLabel = markPointIsObject ? markPoint.label : markPoint
|
||||||
|
|
Loading…
Reference in New Issue