Question

import React, { Component } from 'react';


class About extends Component {
  render() {
    return(
      <div><h1>About Page</h1></div>
    )
  }
}

export default About;

我被困了一个小时，试图弄清楚如何创建类似于href的超链接，但要有反应。这是一个新的.js文件，我想创建一个指向该文件的外部链接，因此当我单击导航栏时，它可以将我定向到Twitter或其他内容，而不是将我定向到空白页。谢谢！

Answer 1

你可以这样做

import React from 'react';
import { Link } from 'react-router';

class About extends React.Component {
    render() {
        return (
            <div>
                <p>Click here to know about us.</p>
                <ul>
                    <li><Link to="/about">About Us</Link></li>
                </ul>
            </div>
        );
    }
}

export default About;

Answer 2

您可以使用react-router。 https://reacttraining.com/react-router/web/example/custom-link 当您包裹路由器时，它具有链接元素，您应该能够更改路由。希望对您有帮助

Answer 3

尝试一下

import React, { Component } from 'react';
import { Link } from 'react-router';


class About extends Component {
  render() {
    return(
      <div><h1>About Page</h1>
     <Link to="url" activeClassName="active">"Link Name"</Link>
      </div>
    );
  }
}

export default About;

有关更多说明，请访问here

Answer 4

Link是 react-router-dom 而非react-router的组成部分。尝试如下更改导入：

import React from 'react';
import { Link } from 'react-router-dom';

class About extends React.Component {
    render() {
        return (
            <div>
                <p>Click here to know about us.</p>
                <ul>
                    <li><Link to="/about">About Us</Link></li>
                </ul>
            </div>
        );
    }
}

export default About;

如何使用React创建指向我的导航栏的超链接？

4 个答案: