ReactJS Link tag - Uncaught ReferenceError: Link is not defined

Question

How do I add <a> tag correctly? I get this error for adding <Link></Link>

Uncaught ReferenceError: Link is not defined

The code:

   render() {
        return (
            <div>
                <Link className="button-close-overlay"><span className="glyphicon glyphicon-remove"></span></Link>
                <article>
                    <div className="container">
                        <div className="content align-center" dangerouslySetInnerHTML={{__html: this.state.article.content}}></div>
                    </div>
                </article>
            </div>
        );
    }

The entire code:

class Article extends React.Component
{
    constructor(props) {
        super(props);
        this.state = {
            article: [],
        };
    }

    // Then fetch the data using $.get():
    componentDidMount() {
        this.serverRequest = $.get(this.props.source, function (result) {
            this.setState({
                article: result
            });
        }.bind(this));
    }

    componentWillUnmount() {
        this.serverRequest.abort();
    }

    render() {
        return (
            <div>
                <link className="button-close-overlay"><span className="glyphicon glyphicon-remove"></span></link>
                <article>
                    <div className="container">
                        <div className="content align-center" dangerouslySetInnerHTML={{__html: this.state.article.content}}></div>
                    </div>
                </article>
            </div>
        );
    }
}

export { Article as default }

Any ideas?

Answer 1

If you're thinking of the React router Link. Then you need to import it.

import { Link } from 'react-router';

or

var Link = require('react-router').Link

otherwise rendering a pure <a> does the trick!