javascript - 在 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));
}

将回调设置为子级。截屏

回调，截图