Функция не получает обновленного состояния в useState React

У меня есть форма, в которой есть некоторые настройки.

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

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

При изменении типа контента в компоненте TypeBlock вызывает setType, куда передается настройка.

Состояние обновляется, но в самой функции, ответственной за подачу нужного блока оно остается undefined:

const [type, setType] = useState();

console.log(type); // все корректно работает
const content = (curPanes) => {
  console.log(type); // не обновляется, остается undefined

  if (count === 0) {
    return (
       <TypeBlock setType={setType} />
    )
  } if (count === 1) {
     return (
       <SpecificBlock type={type} />
     )
  } 
};

Сюда приходит undifined:

const SpecificBlock = ({type}) => {
  console.log('from specific setting', type);
  if(typeWidget === 'chart')
    return (<SpecificBlockChart />);
  if(typeWidget === 'table')
    return (<SpecificBlockTable />);
};

P.S. я понимаю, что состояния обновляются в асинхронном режиме, но проблема в том, что блок со специфическими настройками включается не сразу после блока TypeBlock, а спустя некоторое время (идут подключение нескольких блоков).


Ответы (0 шт):