【React】リンク付きボタンの作り方【MUI】

概要

押したら画面遷移するボタンの作り方

環境

• react@18.2.0
• react-router-dom@6.13.0
• @mui/material@5.13.5

コード

import { Button } from "@mui/material";
import { Link } from "react-router-dom";

export const LinkButton = () => {
  return (
    <>
      <Button variant="outlined" size="large" component={Link} to="/">
        TOP
      </Button>
    </>
  );
};

component={Link}で react-router の Link コンポーネントを指定するだけ