CODEWITHSUNDEEP
reactjs
Teepob Harutaipree
Teepob Harutaipree

Reputation: 56

Is there a way to render dynamic component inside the string text

React Placeholder

The string text that will contain a placeholder for the link element to be placed: such as Please Click {0} to enter new Page. And the {0} will be replace with the Link element

Expected result:

Let say inside we want a clickable link (It can be other things/elements) 

    Please Click here <a href="https://somenewpage.com"> HERE </a> to enter new Page

The reason to do this is to support multi language because the position of placeholder could change to be in other position ( E.g. โปรดกดตรง {0} )

I just wonder is there any other ways to do this cleanly?

Thanks.

Upvotes: 1

Views: 130

Answers (1)

Geetanjali
Geetanjali

Reputation: 468

Another way is, create a new component HyperLink and call it with two props.

class Hyperlink extends React.Component {
  render() {
    return <a href={this.props.link}>{this.props.text}</h2>;
  }
}

Then call Hyperlink as follow

Please Click <Hyperlink link={href} text="HERE"/> to enter new Page

Upvotes: 1

Related Questions