Estoy tratando de obtener el estado de mis luces de tono usando mi API y, en función de esta información, represente la página (básicamente, si mi lámpara está encendida, quiero que mi interruptor de palanca en el sitio web ya esté activado una vez que se cargue la página) Actualmente estoy tratando de pasar datos obtenidos de mi API usando la función asíncrona a useState ()

Aquí está mi código

 const LightSwitch = (props) => { async function lightState(){ const response = await httpGet('http://192.168.1.124/get_light_state/id/' + props.id); let data = await response return data; } lightState().then(data => { console.log(data.Light); } ) const [toggleSwitch, setToggleSwitch] = useState();

Mi respuesta API es

 { "Light": false }

Aquí está mi código completo como referencia.

 import React, { useState } from "react"; import { Switch } from "antd"; import "./LightSwitch.css"; async function httpGet (url){ const response = await fetch(url,{method: 'GET'}); const string = await response.text(); const json = string === "" ? {} : JSON.parse(string); return json; } const LightSwitch = (props) => { async function lightState(){ const response = await httpGet('http://192.168.1.124/get_light_state/id/' + props.id); let data = await response return data; } lightState().then(data => { console.log(data.Light); } ) const [toggleSwitch, setToggleSwitch] = useState(); const onChangeSwitch = (checked) => { setToggleSwitch(!toggleSwitch); if (checked) { console.log(props.name + ' on'); httpGet('http://192.168.1.124/turn_on/id/' + props.id); }else{ console.log(props.name + ' off'); httpGet('http://192.168.1.124/turn_off/id/'+ props.id); } }; return ( <div> <Switch checked={toggleSwitch} onChange={onChangeSwitch}></Switch> </div> ); }; export default LightSwitch;