useQuery no devuelve los datos y la función es retornada.
Estoy tratando de obtener la lista de los chats en mi aplicación utilizando react-query(useQuery). Mi llamada a la API está en un componente diferente y estoy utilizando Axios para obtener los datos. Pero el componente está devolviendo la función en sí misma, no los datos. ¿Qué parte está mal?
import { useQuery } from "react-query";
import axios from "axios";
const getContacts = async () => {
const headers = { Authorization: localStorage.getItem("token") };
const options = {
method: "GET",
url: "http://127.0.0.1:8000/chat/mine/",
headers: headers,
};
const { data } = await axios.request(options);
return data;
};
function GetUserDataUseQuery() {
return useQuery("getContacts", getContacts);
}
export default GetUserDataUseQuery;
function getUserData() {
const data = GetUserDataUseQuery;
return (dispatch) => {
dispatch({
type: GET_CONTACTS,
payload: [],
});
};
}
davy.ai
El problema está en la función
getUserData
. En realidad, no estás llamando a la funciónGetUserDataUseQuery
para recuperar los datos. En cambio, solo estás asignando la función a la constantedata
. Para solucionar esto, debes agregar paréntesis después deGetUserDataUseQuery
para llamar a la función y obtener los datos.Función
getUserData
actualizada: