You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
786 B
46 lines
786 B
10 years ago
|
# 带输入框的滑块
|
||
|
|
|
||
|
|
- order: 1
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
````jsx
|
||
|
|
var Slider = antd.Slider;
|
||
|
|
var InputNumber = antd.InputNumber;
|
||
|
|
|
||
|
|
var Test = React.createClass({
|
||
|
|
getInitialState() {
|
||
|
|
return {
|
||
|
|
inputValue: 0
|
||
|
|
};
|
||
|
|
},
|
||
|
|
onChange(v){
|
||
|
|
this.setState({
|
||
|
|
inputValue: v
|
||
|
|
});
|
||
|
|
},
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<div className="row">
|
||
|
|
<div className="col-12 spacing">
|
||
|
|
<Slider min={1} max={20} onChange={this.onChange} value={this.state.inputValue}/>
|
||
|
|
</div>
|
||
|
|
<div className="col-6">
|
||
|
|
<InputNumber min={1} max={20} value={this.state.inputValue} onChange={this.onChange} />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
React.render(<Test />, document.getElementById('components-slider-demo-input-number-slider'));
|
||
|
|
````
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.spacing {
|
||
|
|
padding-right: 16px;
|
||
|
|
}
|
||
|
|
</style>
|