| 1 | /// <reference types="react" />
|
| 2 |
|
| 3 | import * as React from 'react';
|
| 4 | import CommonProps from '../util';
|
| 5 |
|
| 6 | interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
|
| 7 | defaultValue?: any;
|
| 8 | onChange?: any;
|
| 9 | }
|
| 10 |
|
| 11 | export interface RangeProps extends HTMLAttributesWeak, CommonProps {
|
| 12 | /**
|
| 13 | * 样式类名的品牌前缀
|
| 14 | */
|
| 15 | prefix?: string;
|
| 16 |
|
| 17 | /**
|
| 18 | * 自定义类名
|
| 19 | */
|
| 20 | className?: string;
|
| 21 |
|
| 22 | /**
|
| 23 | * 自定义内敛样式
|
| 24 | */
|
| 25 | style?: React.CSSProperties;
|
| 26 |
|
| 27 | /**
|
| 28 | * 滑块个数
|
| 29 | */
|
| 30 | slider?: 'single' | 'double';
|
| 31 |
|
| 32 | /**
|
| 33 | * 最小值
|
| 34 | */
|
| 35 | min?: number;
|
| 36 |
|
| 37 | /**
|
| 38 | * 最大值
|
| 39 | */
|
| 40 | max?: number;
|
| 41 |
|
| 42 | /**
|
| 43 | * 步长，取值必须大于 0，并且可被 (max - min) 整除。
|
| 44 | */
|
| 45 | step?: number;
|
| 46 |
|
| 47 | /**
|
| 48 | * 设置当前取值。当 `slider` 为 `single` 时，使用 `Number`，否则用 `[Number, Number]`
|
| 49 | */
|
| 50 | value?: number | [number, number];
|
| 51 |
|
| 52 | /**
|
| 53 | * 设置初始取值。当 `slider` 为 `single` 时，使用 `Number`，否则用 `[Number, Number]`
|
| 54 | */
|
| 55 | defaultValue?: number | [number, number];
|
| 56 |
|
| 57 | /**
|
| 58 | * 刻度数值显示逻辑（false 代表不显示，array 枚举显示的值，number 代表按 number 平分，object 表示按 key 划分，value 值显示）
|
| 59 | */
|
| 60 | marks?: boolean | number | Array<number> | {};
|
| 61 |
|
| 62 | /**
|
| 63 | * marks显示在上方('above')or下方('below')
|
| 64 | */
|
| 65 | marksPosition?: 'above' | 'below';
|
| 66 |
|
| 67 | /**
|
| 68 | * 值为 `true` 时，滑块为禁用状态
|
| 69 | */
|
| 70 | disabled?: boolean;
|
| 71 |
|
| 72 | /**
|
| 73 | * 当 Range 的值发生改变后，会触发 onChange 事件，并把改变后的值作为参数传入, 如果设置了value, 要配合此函数做受控使用
|
| 74 | */
|
| 75 | onChange?: (value: number | [number, number]) => void;
|
| 76 |
|
| 77 | /**
|
| 78 | * 滑块拖动的时候触发的事件,不建议在这里setState, 一般情况下不需要用, 滑动时有特殊需求时使用
|
| 79 | */
|
| 80 | onProcess?: (value: number | [number, number]) => void;
|
| 81 |
|
| 82 | /**
|
| 83 | * 是否显示 tip
|
| 84 | */
|
| 85 | hasTip?: boolean;
|
| 86 |
|
| 87 | /**
|
| 88 | * 自定义 tip 显示内容
|
| 89 | */
|
| 90 | tipRender?: (value: number | string) => React.ReactNode;
|
| 91 |
|
| 92 | /**
|
| 93 | * 选中态反转
|
| 94 | */
|
| 95 | reverse?: boolean;
|
| 96 |
|
| 97 | /**
|
| 98 | * 是否pure render
|
| 99 | */
|
| 100 | pure?: boolean;
|
| 101 |
|
| 102 | /**
|
| 103 | * 是否为拖动线段类型,默认slider为double, defaultValue必传且指定区间
|
| 104 | */
|
| 105 | fixedWidth?: boolean;
|
| 106 |
|
| 107 | /**
|
| 108 | * tooltip是否默认展示
|
| 109 | */
|
| 110 | tooltipVisible?: boolean;
|
| 111 |
|
| 112 | /**
|
| 113 | * 是否已rtl模式展示
|
| 114 | */
|
| 115 | rtl?: boolean;
|
| 116 | }
|
| 117 |
|
| 118 | export default class Range extends React.Component<RangeProps, any> {}
|