diff --git a/README.md b/README.md
index 67f6ca1..58023d1 100644
--- a/README.md
+++ b/README.md
@@ -88,11 +88,17 @@ ReactDOM.render(, container);
100 |
The maximum value of the slider |
+
+ | marks |
+ object {number: string} |
+ {} |
+ Mark on the slider. The key determines the position, and the value determines what will show. |
+
| step |
- number |
+ number or `null` |
1 |
- Value to be added or subtracted on each step the slider makes. Must be greater than zero. max - min should be evenly divisible by the step value. |
+ Value to be added or subtracted on each step the slider makes. Must be greater than zero. max - min should be evenly divisible by the step value. When `marks` is not an empty object, `step` can be set to `null`, to make marks as steps. |
| range |
@@ -112,35 +118,17 @@ ReactDOM.render(, container);
|
Set current positions of handles. If range is `false`, the type of `defaultValue` should be `number`. Otherwise, `[number, number]` |
-
- | marks |
- array |
- [] |
- Mark every step for the slider, it will ignore the `step` parameter if it has been defined. Does not work with `range` |
-
| included |
boolean |
true |
If the value is `true`, it means a continuous value interval, otherwise, it is a independent value. |
-
- | defaultIndex |
- number |
- 0 |
- For step or marks slider, determines the initial position of the handle. Does not work with `range` |
-
-
- | index |
- number |
- |
- For step or marks slider, determines current position of the handle. Does not work with `range` |
-
| disabled |
boolean |
false |
- If true the handles can't be moved. |
+ If `true`, handles can't be moved. |
| tipTransitionName |
@@ -150,7 +138,7 @@ ReactDOM.render(, container);
| tipFormatter |
- func |
+ function |
|
Format the value of the tooltip if it shows. |
@@ -158,7 +146,7 @@ ReactDOM.render(, container);
dots |
bool |
false |
- For linear slider, when the `step` value is greater than 1, you can set the `dots` to `true` if you want to render the slider bar with dots. |
+ When the `step` value is greater than 1, you can set the `dots` to `true` if you want to render the slider with dots. |
diff --git a/examples/marks.js b/examples/marks.js
index eef1fc2..bd92b4f 100644
--- a/examples/marks.js
+++ b/examples/marks.js
@@ -22,11 +22,11 @@ var log = function(value) {
ReactDOM.render(
-
Slider with marks, `included=true`
-
+
Slider with marks, `step=null`
+
-
Slider with marks and steps, `included=true`
+
Slider with marks and steps
diff --git a/package.json b/package.json
index deab63d..d4c8239 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "rc-slider",
- "version": "3.0.1",
+ "version": "3.1.0",
"description": "slider ui component for react",
"keywords": [
"react",
diff --git a/src/Slider.jsx b/src/Slider.jsx
index 5cecc7c..8923de3 100644
--- a/src/Slider.jsx
+++ b/src/Slider.jsx
@@ -25,10 +25,6 @@ function pauseEvent(e) {
e.preventDefault();
}
-function isEmpty(collection) {
- return Object.keys(collection).length === 0;
-}
-
class Slider extends React.Component {
constructor(props) {
super(props);
@@ -194,7 +190,7 @@ class Slider extends React.Component {
getPoints() {
const {marks, step, min, max} = this.props;
const points = Object.keys(marks);
- if (isEmpty(marks) || step > 1) {
+ if (step !== null) {
for (let i = min; i <= max; i = i + step) {
points.push(i);
}
@@ -291,9 +287,8 @@ class Slider extends React.Component {
render() {
const {handle, upperBound, lowerBound} = this.state;
- const {className, prefixCls, disabled, dots, included, range,
+ const {className, prefixCls, disabled, dots, included, range, step,
marks, max, min, tipTransitionName, tipFormatter, children} = this.props;
- const marksCount = Object.keys(marks).length;
const sliderClassName = classSet({
[prefixCls]: true,
@@ -311,7 +306,7 @@ class Slider extends React.Component {
}
const handleClassName = prefixCls + '-handle';
- const isNoTip = (marksCount > 0) && !tipFormatter;
+ const isNoTip = (step === null) && !tipFormatter;
const upper = (
);