REACTJS 给出以下错误： TypeError：navigate.push 不是函数

Question

我正在尝试为我的react.js 网站实现一个主页。我的布局很好，我的代码编译没有问题。

但是，当我单击按钮时，我在网站应用程序上收到以下错误：TypeError: navigate.push is not a function在显示的行上 navigate.push("/quiz")

我是新来的，如果有人能帮助我，我将不胜感激！

这是我的代码：

import { Button } from "@material-ui/core";
import { Container } from "@material-ui/core";
import { useNavigate } from "react-router-dom";
import "./Home.css";

const Home = () => {
  const navigate = useNavigate();

  const sendSubmit = () => {
    navigate.push("/quiz");
  };
  return (
    <Container className="content">
      <h1 id="quiz-title">Phishing Quiz</h1>
      <h2 class="question-text">
        Do you think you can beat our phishing quiz?
      </h2>
      <p className="description">
        {" "}
        There are many social engineering attacks on internet however not all of
        them are good enough to trick users. However there are some scams that
        are identical to original websites and usually most of the users get
        tricked by them.
      </p>
      <p className="description">
        Do you think you are smart enough to handle these attacks?
      </p>
      <p className="description">
        We are challenging you with our phishing quiz which will show you
        examples of really good social engineering attacks on internet. We hope
        you can pass!
      </p>
      <p>""</p>
      <Button
        className="button"
        variant="contained"
        color="primary"
        size="large"
        onClick={sendSubmit}
      >
        Start Quiz
      </Button>
    </Container>
  );
};

export default Home;

Answer 1

可以用下面的代码检查

import {useNavigate} from 'react-router-dom';

和内部 Home 箭头功能

const navigate = useNavigate();

const sendSubmit = () => {
    navigate("/quiz");
};