React component to parse links (urls, emails, etc.) in text into clickable links
Live examples are available at http://tasti.github.io/react-linkify/.
Any link that appears inside the Linkify
component will become clickable.
<Linkify>See examples at tasti.github.io/react-linkify/.</Linkify>
Renders to:
See examples at tasti.github.io/react-linkify/
.
If you're feeling lazy, you can wrap Linkify
around anywhere that you want links to become clickable. Even with nested elements, it traverses the tree to find links.
<Linkify>
<div>react-linkify <span>(tasti.github.io/react-linkify/)</span></div>
<div>React component to parse links (urls, emails, etc.) in text into clickable links</div>
See examples at tasti.github.io/react-linkify/.
<footer>Contact: [email protected]</footer>
</Linkify>
Renders to:
react-linkify (tasti.github.io/react-linkify/
)
React component to parse links (urls, emails, etc.) in text into clickable links
See examples at tasti.github.io/react-linkify/
.
Contact: [email protected]
npm install react-linkify --save
var Linkify = require('react-linkify');
React.render(
<Linkify>Examples are available at tasti.github.io/react-linkify/.</Linkify>,
document.body
);
component
The type of component to wrap links in.
type: any
default: 'a'
properties
The props that will be added to every matched component.
type: object
default: {}
NOTE: Use Linkify.MATCH
as a value to specify the matched link. The properties prop will always contain {href: Linkify.MATCH, key: 'LINKIFY_KEY_#'}
unless overridden.
All kind of links detectable by linkify-it are supported. For examples, visit their website.