Дождитесь обновления состояния useState hook

Question

У меня есть массив объектов в состоянии: const [objects, setObjects] = useState([]);

У меня есть кнопка добавления, которая добавляет объект в массив, это тело события onclick:

setObjects([...objects, { id: 20, property1: value1 }]);

У меня есть кнопка удаления, которая удаляет объект из массива, это тело события onclick:

const newObjects = objects.filter(object => { return object.id !== idToRemove; // idToRemove comes from the onclick event }); setObjects(newObjects);

Теперь я хочу сделать что-то с обновленным состоянием, если объект удаляется из состояния.

Проблема в том, что мне нужно дождаться обновления состояния, и я не хочу слушать каждое изменение состояния, только если что-то удалено.

Это то, что у меня есть :

useEffect(() => { //execute a function that uses the updated state }, [objects.length]);

Но это также срабатывает, если объект добавляется в состояние.

Короче: Я хочу что-то сделать, когда объект удаляется из массива объектов, и состояние завершено

Я бы хотел сделать это с помощью хуков.

Заранее спасибо!

Answer 1

Вы можете написать свой собственный хук или добавить другую переменную, которая сохранит длину массива и которая может использоваться для проверки, был ли элемент удален или добавлен.

const [len, setLen] = useState(0);

useEffect(() => {
  if (objects.length < len) {
    // Your code
  }

  setLen(objects.length);
}, [objects.length]);