Convert String in React Components

Question

I have a string which is actually a nested react components name with its props. Want to render that string inside another react component . For example

var String = "<parentComponent title='Parent'><childComponent age='23'></childComponent></parentComponent>"

React Code: -

class MainComponnet extends Component{
 render(){
  let stringComponents = "<parentComponent title='Parent'><childComponent age='23'></childComponent></parentComponent>";
  return(
     {stringComponents}
  )
 }
}

Parent Component JSX : -

class ParentComponent extends Component{
 render(){
  return(
     <div> {this.props.title}</div>
  )
 }
}

Child Component JSX : -

class ChildComponent extends Component{
 render(){
  return(
     <div> {this.props.age}</div>
  )
 }
}

Please help..

Answer 1

Thanks alot for every one for helping me. Library 'react-jsx-parser' solved my problem .