如何使用 React 制作多个链接

介绍

在编写 Web 应用时，经常需要在页面中添加多个链接，例如导航菜单、文章目录等等。使用 React 可以方便地创建一个具有多个链接的组件。

步骤

1. 创建一个 Link 组件

import React from 'react';

function Link(props) {
    return <a href={props.to}>{props.children}</a>;
}

export default Link;

2. 在需要添加多个链接的页面中，使用 Link 组件

import React from 'react';
import Link from './Link';

function App() {
    return (
        <div>
            <nav>
                <Link to="/">Home</Link>
                <Link to="/about">About</Link>
                <Link to="/contact">Contact</Link>
            </nav>
            {/* 其他页面内容 */}
        </div>
    );
}

export default App;

总结

使用 React 可以方便地创建多个链接。通过创建 Link 组件，可以在需要添加多个链接的页面中使用。在 Link 组件的 props 中，可以设置链接的路径和文本内容。