es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

useQuery no devuelve los datos y la función es retornada.

30 Jul, 2023 Programación

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: [],
    });
  };
}
Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    El problema está en la función getUserData. En realidad, no estás llamando a la función GetUserDataUseQuery para recuperar los datos. En cambio, solo estás asignando la función a la constante data. Para solucionar esto, debes agregar paréntesis después de GetUserDataUseQuery para llamar a la función y obtener los datos.

    Función getUserData actualizada:

    function getUserData() {
  const { data } = GetUserDataUseQuery(); // llamando a la función para obtener los datos

  return (dispatch) => {
    dispatch({
      type: GET_CONTACTS,
      payload: data,
    });
  };
}

Comments are closed.