my reset password no longer works , match.params stopped working after i switched to react v6 [duplicate]

*so im getting this error cannot read properties of undefined reading params whenever i click the submit button after i write the new password / confirm new password in the input tab , i was working with react v5 when writing this code and it was working back then , i started getting the error when i updated to the v6 version *

this is my resetpassword.js file where the error occurs

import { useState } from "react";
import { Link } from "react-router-dom";
import axios from "axios";
import { useMatch, useParams } from "react-router-dom";
import "./ResetPasswordScreen.css";

const ResetPasswordScreen = ({ history, match }) => {
const [password, setPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState("");
const [error, setError] = useState("");
const [success, setSuccess] = useState("");

const resetPasswordHandler = async (e) => {
e.preventDefault();

const config = {
  header: {
    "Content-Type": "application/json",
  },
};

if (password !== confirmPassword) {
  setPassword("");
  setConfirmPassword("");
  setTimeout(() => {
    setError("");
  }, 5000);
  return setError("Les mots de passe ne correspondent pas");
}

try {
  await axios
    .put(
      `/api/auth/passwordreset/${match.params.resetToken}`,  //this is where the error happens
       {
        password,
      },
      config
    )
    .then(({ data }) => {
      console.log(data);
      setSuccess(data.data);
    });
} catch (error) {
  console.log(error);
  // setError(error.response.data.error);
  setTimeout(() => {
    setError("");
  }, 5000);
}
};

**this is my auth.js file where the backend for the resetpassword screens is **

//     Reset User Password
exports.resetPassword = async (req, res, next) => {
// Compare token in URL params to hashed token

const resetPasswordToken = crypto
.createHash("sha256")
.update(req.params.resetToken)
.digest("hex");

try {
const user = await User.findOne({
  resetPasswordToken,
  resetPasswordExpire: { $gt: Date.now() },
});

if (!user) {
  return next(new ErrorResponse("Invalid Token", 400));
}

user.password = req.body.password;
user.resetPasswordToken = undefined;
user.resetPasswordExpire = undefined;

await user.save();

res.status(201).json({
  success: true,
  data: "Password Updated Success",
  token: user.getSignedJwtToken(),
});
} catch (err) {
next(err);
}
};

const sendToken = (user, statusCode, res) => {
const token = user.getSignedJwtToken();
res.status(statusCode).json({ sucess: true, token });
};

in UserRoute.js

<Route
      exact
      path="/passwordreset/:resetToken"
      element={<ResetPasswordScreen />}
    />
  </Routes>

routes.js files in the backend

router.route("/passwordreset/:resetToken").put(resetPassword);

Via Active questions tagged javascript - Stack Overflow https://ift.tt/uSv3GPU