Реагируйте, при использовании materialize modal => удаляет элемент с неправильным _id - PullRequest
0 голосов
/ 02 марта 2020

У меня есть два компонента. При нажатии на иконку tra sh в компоненте UserItem - модальное DeleteUserModal отображается с кнопкой подтверждения «удалить».
Но когда я удаляю элемент - он удаляет не тот элемент ... Использование onMouseOver={() => console.log(_id)} в модальном компоненте на разных предметах я вижу, что _id не меняется, но почему?

Кстати, если я использую функцию onDelete непосредственно в компоненте UserItem - она ​​отлично работает.

const UserItem = ({ user, index }) => {
  const userContext = useContext(UserContext);
  const { setIndexUser, deleteUser } = userContext;
  const { firstName, lastName, role, _id } = user;
  const onDelete = () => {
    setIndexUser(null);
    deleteUser(_id);
  };
  useEffect(() => {
    M.AutoInit();
    // eslint-disable-next-line
  }, []);
  return (
    <div className="card">
      <div
        className="right-align card-action"
        onMouseOver={() => console.log(_id)}
      >
        {" "}
        // works fine, shows id of howered item
        <a href="#delete-user-modal" className="modal-trigger">
          <i className="fas fa-trash-alt" />
        </a>
      </div>
      <DeleteUserModal onDelete={onDelete} _id={_id} />
    </div>
  );
};

Модальное удаление элемента:

import React from "react";

const DeleteUserModal = ({ onDelete, _id }) => {
  return (
    <div id="delete-user-modal" className="modal">
      <div className="modal-content">
        <h4>Delete this user, all his RCOMs and devices?</h4>
      </div>
      <div className="modal-footer" onMouseOver={() => console.log(_id)}>
        {" "}
        //works incorrectly, id sticks the same...
        <a
          href="#!"
          className="modal-close waves-effect waves-green btn-flat red-text"
          onClick={onDelete}
        >
          Delete
        </a>
      </div>
    </div>
  );
};
export default DeleteUserModal;

1 Ответ

0 голосов
/ 02 марта 2020

Я решил эту проблему, используя Context API: при нажатии на иконку tra sh - _id сохраняется в хранилище. И тогда это передается модалу. В этом случае он работает правильно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...