Radios View Source

1
import * as React from "react";
2
import { RadioGroup } from "slate-react-system";

1
const RADIO_GROUP_OPTIONS = [
2
  {
3
    value: "1",
4
    label: (
5
      <React.Fragment>
6
        <strong>Option one</strong>
7
        <br />I want to have cake and soda for breakfast.
8
      </React.Fragment>
9
    ),
10
  },
11
  {
12
    value: "2",
13
    label: (
14
      <React.Fragment>
15
        <strong>Option two</strong>
16
        <br />I want to have cake and soda for lunch.
17
      </React.Fragment>
18
    ),
19
  },
20
  {
21
    value: "3",
22
    label: (
23
      <React.Fragment>
24
        <strong>Option three</strong>
25
        <br />I want to have cake and soda for dinner.
26
      </React.Fragment>
27
    ),
28
  },
29
];

1
class ExampleOne extends React.Component {
2
  state = { ExampleOne: "2" };
3

4
  _handleChange = (e) => this.setState({ [e.target.name]: e.target.value });
5

6
  render() {
7
    return (
8
      <RadioGroup
9
        name="ExampleOne"
10
        options={RADIO_GROUP_OPTIONS}
11
        selected={this.state.ExampleOne}
12
        onChange={this._handleChange}
13
      />
14
    );
15
  }
16
}