prettier-markdown
Version:
Prettier JavaScript code in markdown.
56 lines (48 loc) • 1.24 kB
Markdown
---
title: tipFormmater
order: 5
---
tipFormatter 示例
````jsx
import { Range } from 'ice';
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
value: 128
};
}
//onChange,移动结束时,如果startValue和endValue不等,会触发这个事件
onChange(value) {
console.log('onChange value:', value);
}
//mouseDown以及onMove的时候,如果startValue和endValue不等,会触发这个事件.如果是受控组件,改变state要写在这个事件里
onProcess(value) {
console.log('onProcess');
this.setState({ value });
}
formatter(value) {
return '$' + value;
}
render() {
return (
<div style={{ width: '400px', margin: '50px' }}>
<p>范围 0 ~ 1024</p>
<div style={{ width: '400px', marginTop: '50px' }}>
<Range
defaultValue={256}
tipFormatter={this.formatter.bind(this)}
value={this.state.value}
onChange={this.onChange.bind(this)}
onProcess={this.onProcess.bind(this)}
min={0}
max={1024}
marks={[0, 1024]}
/>
</div>
</div>
);
}
}
ReactDOM.render(<App />, mountNode);
````