mirror of
https://github.com/wassname/slider.git
synced 2026-10-28 13:30:39 +08:00
25 lines
905 B
React
25 lines
905 B
React
import React from 'react';
|
|
import { classSet } from 'rc-util';
|
|
|
|
const Steps = ({prefixCls, points, dots, included, lowerBound, upperBound, max, min}) => {
|
|
const range = max - min;
|
|
const elements = points.filter((point) => typeof point === 'string' || dots).map(parseFloat)
|
|
.map((point) => {
|
|
const offset = (point - min) / range * 100 + '%';
|
|
const style = { left: offset };
|
|
|
|
const isActived = (!included && point === upperBound) ||
|
|
(included && point <= upperBound && point >= lowerBound);
|
|
const pointClassName = classSet({
|
|
[prefixCls + '-dot']: true,
|
|
[prefixCls + '-dot-active']: isActived,
|
|
});
|
|
|
|
return <span className={pointClassName} style={style} key={point} />;
|
|
});
|
|
|
|
return <div className={prefixCls + '-step'}>{elements}</div>;
|
|
};
|
|
|
|
export default Steps;
|