A continuación se muestra el código del Servicio.
import { fetchEventSource } from '@microsoft/fetch-event-source'; export const AlertFetchEventSource = () => { fetchEventSource('https://puppygifs.tumblr.com/api/read/json'), { onmessage(ev) { const data = JSON.parse(ev.data); return data; }, }; }; export default { AlertFetchEventSource };index.tsx donde estoy haciendo la llamada a este servicio pero no devuelve ningún dato
import React, { Component } from 'react'; import { render } from 'react-dom'; import Hello from './Hello'; import './style.css'; import backendService from './services/backendService'; interface AppProps {} interface AppState { name: string; } class App extends Component<AppProps, AppState> { constructor(props) { super(props); this.state = { name: 'React', }; console.log(backendService.AlertFetchEventSource()); } render() { return ( <div> <Hello name={this.state.name} /> <p>Start editing to see some magic happen :)</p> </div> ); } } render(<App />, document.getElementById('root'));Dado que la biblioteca que está utilizando es un controlador de eventos, en realidad nunca devuelve datos. Deberá proporcionarle una devolución de llamada para que se ejecute cuando reciba eventos.
// you might want to specify a better type than `any` type MessageHandler = (data: any) => void; export const AlertFetchEventSource = (onEvent: MessageHandler) => { fetchEventSource('https://puppygifs.tumblr.com/api/read/json'), { onmessage(ev) { const data = JSON.parse(ev.data); onEvent(data); }, }); // you had a typo here, missing ")" };y usarlo como
import { AlertFetchEventSource } from "./services/backendService"; // snip AlertFetchEventSource(data => { // handle event data, eg console.log(data); // or perhaps something like this.setState(data); });