в useCallback не обновляется значение состояния

Question

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

Почему это так и как решить эту проблему?

// calback
const resizeColumn = useCallback(nextWidth => {
    console.log(columns); // log empty array, that is initial value why!?
}, [columns]);


function initColumns(newColumns: Array<IColumn>) {
    return newColumns.map((item, idx) => {
        const column: IColumn = {...item, ...(props.columnsConfig[item.key] || {})};

        if (!column.hasOwnProperty("sorter") && props.sortable && !column.sorter)
            column.sorter = Boolean(props.onChangeSort) || sorter;

        column.title = t(column.title);
        column.render = renderCell(column);
        column.required = Boolean(column.fixed);
        column.width = props.defaultColumnWidth;
        column.translateData = props.translateDataSource;

        column.onHeaderCell = column => ({
            column,
            onResize: nextWidth => resizeColumn(nextWidth) // 
        }); // set callback to child

        return column;
    }).sort((a, b) => +Boolean(b.fixed) - +Boolean(a.fixed));
}

установить обратный вызов для ребенка. снимок экрана

обратный вызов, снимок экрана