У меня есть это предупреждение в моем использовании Reacts useCallback hook.
React Hook useCallback имеет отсутствующую зависимость: 'history'. Либо включите его, либо удалите зависимость array.eslint (response-hooks / исчерпывающе-deps
import { useHistory } from "react-router-dom";
const MyFunctionalComponent = () => {
const history = useHistory();
....
const someFunction = useCallback(((param) => {
history.push({
search: `?myParam=${param}`
});
....
}), [history]); <-- Putting history object here removes the warning...
return (
<Fragment>
<Something onClick={() => someFunction(myParam)}
</Fragment>
);
}
Помещение объекта истории в параметр зависимости useCallback удаляет предупреждение, но не имеет смысла иметь его как зависимость для этого метода. Этот метод не зависит от состояния истории, он просто вызывает его для обновления истории. Кроме того, я подозреваю, что мой родительский компонент будет перерисовываться при каждом изменении истории, что противоречит цели using useCallback.
Мой вопрос заключается в том, как использовать объект истории в моем методе useCallback:
- Без предупреждения компилятора ( React Hook useCallback отсутствует зависимость: 'history '. Или включите его или удалите зависимость array.eslint (react-hooks / исчерпывающе-deps )
- Без установки оператора игнорирования для предупреждения ( // eslint-disable-line реагировать -hooks / исчерпывающе-deps )
- Без использования window.history, так как это плохо работает с пользователем. Само использование крючка useLocation (). События изменения истории не инициируются window.history. Поэтому нельзя использовать ловушки useEffect & useLocation, как показано в примере в этой статье: https://reacttraining.com/blog/react-router-v5-1/?fbclid=IwAR1WHJKKeF0rO_-jW31mRCatWq5o143OvgyURn6R3uGlHNQ_dqs3QQ4ddLs