How do I render react-router Link component from a paragraph with contents? It might be at random position and I don't find handly sperating content param to beforeText, link and afterText object
Let's say I'm building a blog where the blog-post section is passing content with some url's to the text rendering component and it be Link to internal app route (or might be not, just plain text)
class ParentComponent extends Component{
render(){
<Content content='Lorem ... <Link to="/page">Some link</Link> lorem ipsum ...'
}
}
class Content extends Component {
const { content } = this.props
render(){
<div className="text-section">
{content}
</div>
}
}
You should use this.props.children for passing nested components so that they can be rendered straight forward. Your code should then look like this:
class ParentComponents extends Component{
render(){
<Content>
<p>Lorem ...<Link to="/page">Some link</Link>lorem ipsum</p>
</Content>
}
}
class Content extends Component {
render(){
<div className="text-section">
{this.props.children}
</div>
}
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments