Блог

 const startLive = () => {
    // connect to websocket only on start button
    
     setliveChartState({
      ...liveChartState,
      liveActive: !liveChartState.liveActive,
      historicLiveActive: true,
      start: new Date(),
    });

/*- - - -after updation - - - >*/
    const { ws, liveActive } = liveChartState;
    
    // if clicked on stop then close websocket
    if (!liveActive amp;amp; ws) {
      ws.close();
    clearLiveInterval();
    }
    // if clicked on  start and websocket close then connect
    if ((!ws || ws.readyState === WebSocket.CLOSED)amp;amp; liveActive) connect();
    fetchData("historic");
  };
  

Функция startlive вызывается при нажатии кнопки start… Эта функция используется для обновления состояния, а затем для выполнения кода, который появится позже, как уже упоминалось.

Но он запускается, когда setlivechartstate даже не завершил обновление.

Я не хочу использовать перехват Use effect, поскольку я просто хочу запускать код только при нажатии кнопки, поскольку он работает как start, так и stop, а также liveActive также изменяется в других функциях.. Таким образом, использование useEffect с этой зависимостью создало проблему

Каков наилучший способ заставить эту функцию работать и запускать код только после завершения обновления

Новое установленное значение состояния будет доступно только при следующем рендеринге. Я бы предложил использовать useeffect. Или вы могли бы вместо этого использовать useReducer. Это тоже сработало бы