Necesito obtener información de integraciones en formato JSON y necesito ayuda para convertir useRef (componente funcional) en createRef (componente de clase). componente funcional:
import { createTTNCClient } from '~/shared/clients/ttnc'; const DevicesTable: React.FC<Props> = (props) => { const TTNCClient = useRef(createTTNCClient()); const fetchIntegrations = async (): Promise<Integration[]> => { try { const resp = await TTNCClient.current.getIntegrations(); return resp.data.content; } catch (err) { throw new Error(err); } }; }Traté de hacer un componente de clase:
export class DevicesTable extends React.PureComponent<Props> { private TTNCClientRef: React.RefObject<any>; constructor(props) { super(props); this.TTNCClientRef = React.createRef(); } render() { const TTNCClient = this.TTNCClientRef.current.getIntegrations(); const fetchIntegrations = async (): Promise<Integration[]> => { try { const resp = await TTNCClient; console.log(resp.data.content) return resp.data.content; } catch (err) { throw new Error(err); } }; } return ( <div></div> ) }Pero arroja un error con respecto a la función getIntegrations(). Supongo que porque no agregué 'createTTNCClient' en el componente de clase. Aquí cómo se ve con el componente funcional:
const TTNCClient = useRef(createTTNCClient()); pero no sé cómo agregar ' createTTNCClient() ' a ' createRef ' en un componente de clase.
Su código de componente de clase no parece llamar al constructor createTTNCClient .
Probablemente podrías hacerlo allí en el constructor de clases:
constructor(props) { super(props); this.TTNCClientRef = React.createRef(); this.TTNCClientRef.current = createTTNCClient(); } O en el método del ciclo de vida del componentDidMount :
componentDidMount() { this.TTNCClientRef.current = createTTNCClient(); }Y como precaución, aplique algunas comprobaciones nulas cuando intente invocar:
const TTNCClient = this.TTNCClientRef.current?.getIntegrations();