Package Exports
- react-external-link
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-external-link) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
React External Link
This library provides a simple ExternalLink
component for react which can be used to render a
tags with both target="_blank"
and rel="noopener noreferrer"
attributes.
Installation
Using npm: npm istall react-external-link --save
Using yarn: yarn add react-external-link
Usage
If you just need a simple link with no custom text:
import React from 'react';
import { ExternalLink } from 'react-external-link';
const MyComponent = () => (
<div>
<ExternalLink href="https://example.com" />
</div>
);
export default MyComponent;
This will be rendered as <a href="https://example.com" target="_blank" rel="noopener noreferrer">https://example.com</a>
.
If you need to provide a custom content, you can do so by providing the ExternalLink
's children
:
import React from 'react';
import { ExternalLink } from 'react-external-link';
const MyComponent = () => (
<div>
<ExternalLink href="https://example.com">
<span>Visit the site</span>
<ExternalLink>
</div>
);
export default MyComponent;
This will be rendered as:
<a href="https://example.com" target="_blank" rel="noopener noreferrer">
<span>Visit the site</span>
</a>