Блог

Здравствуйте, кто-нибудь может помочь мне определить, в чем здесь ошибка: я продолжаю получать эту ошибку в консоли:

xhr.js: 178 ПОЛУЧИТЬ http://localhost:3000/update/5f6b4ae1d9cde357c8500069 404 (Не найден)

 import React, { useState, useContext, useEffect } from "react";
import UserContext from "../../context/UserContext";
import Axios from "axios";
import ErrorNotice from "../misc/ErrorNotice";

export default function UpdateEvent(props) {
  const { userData } = useContext(UserContext);
  const [title, setTitle] = useState();



  useEffect(() => {
    const token = localStorage.getItem("auth-token");
    Axios.get(`http://localhost:3000/update/${props.match.params.id}`, {
        headers: { "x-auth-token": token },
    })
    .then(res=> [
        setTitle(res.data.title)
    ])
    .catch(error=>console.log(error))
  }, []);

  return (
    <div className="page">
        <h2>{title}</h2>
    </div>
  );
}

  

Так я вызываю свой компонент обновления со своей домашней страницы:

             <button
              className="btn btn-outline-success"
              onClick={() => updateEvent(event._id)}
            >
              Update
            </button>{" "}
          </td>
          <td>
            <button
              onClick={deleteEvent(event._id)}
              className="btn btn-outline-warning"
            >
              Delete
            </button>
          </td>
        </tr>
      );
    });
  }


  const updateEvent = (id) => history.push(`/update/${id}`);

  

Я добавил следующие маршруты в свой App.js файл:

             <Switch>
              <Route exact path="/" component={Home} />
              <Route path="/login" component={Login} />
              <Route path="/register" component={Register} />
              <Route path="/new" component={AddEvent} />
              <Route path="/update/:id" component={UpdateEvent} />
            </Switch>

  

И мой сервер для обновления выглядит так:

 //update an event BACKEND
router.put("update/:id", auth, async (req, res) => {
  const event = await Event.findOne({ userId: req.user, _id: req.params.id });
  if (!event)
    return res.status(400).json({
      msg: "No event found with this ID that belongs to the current user.",
    });
  const updatedEvent = await Event.findOneAndUpdate(
    { _id: req.params.id },
    req.body
  );
  res.send({ message: "Event updated." });
});