wassname/slider
1
0
Fork 0
mirror of https://github.com/wassname/slider.git synced 2026-09-09 11:35:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #43 from react-component/fix-marks

Browse Source 
fix: the key of marks could be negative
This commit is contained in:
Benjy Cui
2015-11-18 18:37:46 +08:00
parent ee71955e14 a7c2319949
commit 6f39212df5
3 changed files with 9 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/marks.js
+7 -6
View File
@@ -8,6 +8,7 @@ var Slider = require('rc-slider');
var style = {width: 400, margin: 50};
var marks = {
'-10': '-10°C',
0: '0°C',
26: '26°C',
37: '37°C',
@@ -22,29 +23,29 @@ ReactDOM.render(
<div>
<div style={style}>
<p>Slider with marks, `included=true`</p>
<Slider marks={marks} onChange={log} defaultValue={20} />
<Slider min={-10} marks={marks} onChange={log} defaultValue={20} />
</div>
<div style={style}>
<p>Slider with marks and steps, `included=true`</p>
<Slider marks={marks} step={10} onChange={log} defaultValue={20} />
<Slider min={-10} marks={marks} step={10} onChange={log} defaultValue={20} />
</div>
<div style={style}>
<p>Slider with marks, `included=false`</p>
<Slider marks={marks} included={false} defaultValue={20} />
<Slider min={-10} marks={marks} included={false} defaultValue={20} />
</div>
<div style={style}>
<p>Slider with marks and steps, `included=false`</p>
<Slider marks={marks} step={10} included={false} defaultValue={20} />
<Slider min={-10} marks={marks} step={10} included={false} defaultValue={20} />
</div>
<div style={style}>
<p>Range with marks</p>
<Slider range marks={marks} onChange={log} defaultValue={[20, 40]} />
<Slider min={-10} range marks={marks} onChange={log} defaultValue={[20, 40]} />
</div>
<div style={style}>
<p>Range with marks and steps</p>
<Slider range marks={marks} step={10} onChange={log} defaultValue={[20, 40]} />
<Slider min={-10} range marks={marks} step={10} onChange={log} defaultValue={[20, 40]} />
</div>
</div>
, document.getElementById('__react-content'));
package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "rc-slider",
"version": "3.0.0",
"version": "3.0.1",
"description": "slider ui component for react",
"keywords": [
"react",
src/Marks.jsx
+1 -7
View File
@@ -17,13 +17,7 @@ const Marks = ({className, marks, included, upperBound, lowerBound, max, min}) =
});
const style = { width: markWidth };
if (point === marksCount - 1) {
style.right = -unit / 4 + '%';
} else if (point === 0) {
style.left = -unit / 4 + '%';
} else {
style.left = (point - min) / range * 100 - unit / 4 + '%';
}
style.left = (point - min) / range * 100 - unit / 4 + '%';
return (<span className={markClassName} style={style} key={point}>
{marks[point]}