React JS Component for handling radio button groups.

RadioGroup.js

import React from "react";

class RadioGroup extends React.Component{

    constructor(props){
        super(props);
        this.handleCheckboxChange = this.handleCheckboxChange.bind(this);
        this.state = { selectedOption : this.props.checked }
    }

    componentDidMount() {
	    this.setState({selectedOption : this.props.checked})
    }

    handleCheckboxChange(e){
        this.setState({ selectedOption: e.target.value })
	    this.props.callbackFn(e.target.value, this.props.keyState)
    }

    render(){
        let id1 =  this.props.name+"_1";
        let id2 =  this.props.name+"_2";

        return(
            <div>
                <div className="form-check form-check-inline">
                    <input
                        checked={this.state.selectedOption === "S"}
                            onChange={this.handleCheckboxChange}
                            className="form-check-input"
                            type="radio"
                            name={this.props.name}
                            id={id1}
                            value="S" />
                    <label className="form-check-label" htmlFor="radio">Sim</label>
                </div>

                <div className="form-check form-check-inline">
                        <input
                            checked={this.state.selectedOption === "N"}
                            onChange={this.handleCheckboxChange}
                            className="form-check-input"
                            type="radio"
                            name={this.props.name}
                            id={id2}
                            value="N" />
                        <label className="form-check-label" htmlFor="radio">Não</label>
                </div>
            </div>
        );
    }
}

export default RadioGroup;