Передача в обратном вызове после изменения состояния

Question

В настоящее время пытаюсь преобразовать шаблон React + Material UI + Firebase, найденный на веб-сайте Material UI. Сейчас я пытаюсь (codesandbox) , чтобы открыть диалоговое окно для регистрации. Текущая настройка для App.js имеет функцию:

openDialog = (dialogId, callback) => {
  const dialog = this.state[dialogId];

  if (!dialog || dialog.open === undefined || null) {
    return;
  }

  dialog.open = true;

  this.setState({ dialog }, callback);

};

И я пытаюсь преобразовать ее для использования подобных хуков, но не знаю, как собратный вызов:

const openDialog = e => {
  setDialog({ ...dialog, [e.target.name]: true });
};

Answer 1

Вы можете перезвонить в useEffect. Вам необходимо передать dialog.open в качестве зависимости для хука useEffect, который будет работать только при изменении dialog.open,

useEffect(() => {
  if (dialog.open) {
    callback();    //This is where you call your callback function
  }
},[dialog.open,callback])  //pass your function as dependency

Демо