Facing issue while adding radio button in react - input is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`

Question

Input is a void element tag and must neither have children nor use dangerouslySetInnerHTML.

  render() {     let radioid = this.props.radioid;     return (       <div className="row">         {this.props.options.map(function(option) {           return (             <div key={radioid} className="column">               <input type="radio" name={radioid} value={option}>                 <label>{option}</label>               </input>             </div>           );          })}       </div>     );   } 

For example options is a list of elements like A, B, C, D

Answer 1

As per the error, the input tag should not have any children, take the label out of input closure tag

render() {     let radioid = this.props.radioid;     return (         <div className="row">         {this.props.options.map(function(option) {             return (             <div key={radioid} className="column">                 <label>{option}</label>                 <input type="radio" name={radioid} value={option}/>             </div>             );         })}         </div>     ); }