class XD extends React.Component {

    state = {
        showInput: false
    };

    render() {
        const {showInput} = this.state;
        return (
            <div>
                <p>xD</p>
                <div>
                    <input type="checkbox" id="scales" name="scales"
                        checked={showInput} onClick={() => this.setState(prev =>({showInput: !prev.showInput}))}/>
                    <label htmlFor="scales">Scales</label>
                </div>
                {showInput &&
                    <div>
                        <input type="text" id="horns" name="horns"/>
                        <label htmlFor="horns">Horns</label>
                    </div>
                }
            </div>
        );
    }
}