feat(Slider): min、max、step can be string

This commit is contained in:
陈嘉涵 2020-01-30 10:13:41 +08:00
parent 7b6022d0e7
commit 02fbc2126a
3 changed files with 10 additions and 10 deletions

View File

@ -99,9 +99,9 @@ export default {
| Attribute | Description | Type | Default | | Attribute | Description | Type | Default |
|------|------|------|------| |------|------|------|------|
| value | Current value | *number* | `0` | | value | Current value | *number* | `0` |
| max | Max value | *number* | `100` | | max | Max value | *number \| string* | `100` |
| min | Min value | *number* | `0` | | min | Min value | *number \| string* | `0` |
| step | Step size | *number* | `1` | | step | Step size | *number \| string* | `1` |
| bar-height | Height of bar | *number \| string* | `2px` | | bar-height | Height of bar | *number \| string* | `2px` |
| button-size `v2.4.5` | Button size | *number \| string* | `24px` | | button-size `v2.4.5` | Button size | *number \| string* | `24px` |
| active-color | Active color of bar | *string* | `#1989fa` | | active-color | Active color of bar | *string* | `#1989fa` |

View File

@ -101,9 +101,9 @@ Slider 垂直展示时,高度为 100% 父元素高度
| 参数 | 说明 | 类型 | 默认值 | | 参数 | 说明 | 类型 | 默认值 |
|------|------|------|------| |------|------|------|------|
| value | 当前进度百分比 | *number* | `0` | | value | 当前进度百分比 | *number* | `0` |
| max | 最大值 | *number* | `100` | | max | 最大值 | *number \| string* | `100` |
| min | 最小值 | *number* | `0` | | min | 最小值 | *number \| string* | `0` |
| step | 步长 | *number* | `1` | | step | 步长 | *number \| string* | `1` |
| bar-height | 进度条高度,默认单位为`px` | *number \| string* | `2px` | | bar-height | 进度条高度,默认单位为`px` | *number \| string* | `2px` |
| button-size `v2.4.5` | 滑块按钮大小,默认单位为`px` | *number \| string* | `24px` | | button-size `v2.4.5` | 滑块按钮大小,默认单位为`px` | *number \| string* | `24px` |
| active-color | 进度条激活态颜色 | *string* | `#1989fa` | | active-color | 进度条激活态颜色 | *string* | `#1989fa` |

View File

@ -15,15 +15,15 @@ export default createComponent({
activeColor: String, activeColor: String,
inactiveColor: String, inactiveColor: String,
min: { min: {
type: Number, type: [Number, String],
default: 0, default: 0,
}, },
max: { max: {
type: Number, type: [Number, String],
default: 100, default: 100,
}, },
step: { step: {
type: Number, type: [Number, String],
default: 1, default: 1,
}, },
value: { value: {
@ -119,7 +119,7 @@ export default createComponent({
? event.clientY - rect.top ? event.clientY - rect.top
: event.clientX - rect.left; : event.clientX - rect.left;
const total = this.vertical ? rect.height : rect.width; const total = this.vertical ? rect.height : rect.width;
const value = (delta / total) * this.range + this.min; const value = +this.min + (delta / total) * this.range;
this.startValue = this.value; this.startValue = this.value;
this.updateValue(value, true); this.updateValue(value, true);