Блог

Я только начал использовать перехваты в react и создаю прототип пользовательского перехвата для фреймворка. Перехват должен принимать объект в качестве аргумента для инициализации и очистки (например, настройка / удаление обратных вызовов).

Вот мой упрощенный код на данный момент:

 export function useManager(InitObj) {
  const [manager] = useState(() => new Manager());

  useEffect(() => {
    manager.addRefs(InitObj)
    return () => manager.removeRefs(InitObj)
  }, [manager]);

  return manager;
}
 

для использования следующим образом:

     useManager({ cb1: setData1, cb2: setData2... })
 

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

Я ставлю консоль.регистрируйте повсюду, чтобы узнать, правильно ли я понимаю, какой код будет выполняться во время вызова рендеринга. Из того, что я могу сказать, этот код делает на 100% то, что я ожидал от него!

К сожалению (и понятно) Я получаю предупреждение, потому что я не включил InitObj в зависимости эффектов. Но поскольку я получаю литерал объекта, простое его добавление туда приведет к очистке / повторному запуску эффекта при каждом вызове рендеринга, поскольку {} != {} это было бы совершенно ненужно.

Мои исследования пока выявили только сообщения в блогах, подобные этому, но здесь используются только примитивные данные, которые легко классифицируются как «одинаковые» ( 1 == 1 )

До сих пор я нашел 3 возможных решения, которые меня не совсем устраивают:

1. использование useMemo для запоминания литерала объекта вне перехвата

 useManager(useMemo(() => { cb: setData }, []))
 

Это добавляет больше ответственности разработчику, использующему мой код => нежелательно!

2. использование useState внутри перехвата

 const [iniOBj] = useState(InitObj);
 

Уже намного лучше, но он добавляет состояние, которое не похоже на состояние. И это требует (минимального) времени выполнения и памяти, я бы хотел избежать этого, если это возможно.

3. использование // eslint-disable-next-line react-hooks/exhaustive-deps

Работает наверняка, но все еще могут быть другие зависимости, которые могут быть пропущены, если я просто отключу предупреждение.

Итак, мой вопрос:

Как я могу использовать объект в качестве инициализатора для пользовательских перехватов, не добавляя сложности / состояния или не вызывая будущих проблем?

Я наполовину ожидаю, что опция useState будет моим лучшим выбором, но, поскольку я новичок в перехватах, все еще может быть что-то, что до сих пор ускользало от моего понимания.