React.useCallback () все еще перерисовывает дочерний компонент - PullRequest
Новая
       66

React.useCallback () все еще перерисовывает дочерний компонент

2 голосов
/ 11 марта 2020

1) Я передаю метод-обработчик onPaginationChange дочернему компоненту (B) в качестве реквизита от родительского компонента (A)

2) Я использую хуки useState (), поэтому каждый раз когда я вызываю setFieldName (), родительский компонент перерисовывается и поэтому дочерний компонент, даже когда обработчик не вызывается.

3) Я пытаюсь использовать ловушку useCallback, чтобы избежать повторного рендеринга дочернего компонента из-за родительского изменение состояния компонента. Но, тем не менее, я вижу, что дочерний компонент многократно рендерится в зависимости от количества изменений состояния родительского компонента.

вот моя функция-обработчик, переданная в качестве аргумента для useCallback. Функция-обработчик получает 2 реквизита currentPageNo , pageSize , и я использую currentPage в качестве зависимости. 

const onPaginationChange = useCallback((currentPageNo, pageSize) => {
    const startRow = (currentPageNo - 1) * pageSize;
    const newData = apiResponse.slice(startRow, startRow + pageSize);

    setCurrentPage(currentPageNo);
    setGridData(newData);
}, [currentPage]);

Дайте мне знать, если найдете причину root вопроса.

...