react-toolbox/spec/components/radio.js

40 lines
1.0 KiB
JavaScript
Raw Normal View History

import React from 'react';
2015-10-20 21:06:24 +03:00
import { RadioGroup, RadioButton } from '../../components/radio';
2015-10-22 02:31:17 +03:00
class RadioGroupTest extends React.Component {
2015-11-12 03:07:30 +03:00
state = {
2017-01-26 20:05:32 +03:00
value: 'vvendetta',
2015-11-12 03:07:30 +03:00
};
handleChange = (value) => {
2017-01-26 20:05:32 +03:00
console.log('Changed!', { comic: value });
this.setState({ value });
2015-10-22 02:31:17 +03:00
};
2015-10-22 02:31:17 +03:00
handleFocus = () => {
console.log('Focused V for a Vendetta');
2015-10-22 02:31:17 +03:00
};
2015-10-22 02:31:17 +03:00
handleBlur = () => {
console.log('Blurred Watchmen');
2015-10-22 02:31:17 +03:00
};
2017-01-26 20:05:32 +03:00
render() {
return (
<section>
2015-10-06 22:34:43 +03:00
<h5>Radio Button</h5>
2017-01-26 20:05:32 +03:00
<p style={{ marginBottom: '10px' }}>Lorem ipsum...</p>
2017-01-26 20:05:32 +03:00
<RadioGroup name="comic" value={this.state.value} onChange={this.handleChange}>
<RadioButton label="The Walking Dead" value="thewalkingdead" />
<RadioButton label="From Hell" value="fromhell" disabled />
<RadioButton label="V for a Vendetta" value="vvendetta" onFocus={this.handleFocus} />
<RadioButton label="Watchmen" value="watchmen" onBlur={this.handleBlur} />
</RadioGroup>
</section>
);
}
2015-10-21 13:25:07 +03:00
}
2015-10-22 02:31:17 +03:00
export default RadioGroupTest;