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.

Cómo buscar una palabra clave en una API con React Query

15 Jul, 2023 Programación

¿Cómo puedo utilizar la “palabra clave” de los parámetros en mi solicitud de axios get?
Mi enfoque no está funcionando.

// Código Front-End

const ComprasLista = () => {
  const { keyword } = useParams();

  const compras = useQuery("compras", ({ keyword = "" }) => {
    return axios
      .get(`https://582821e.sse.codesandbox.io/api/compras?keyword=${keyword}`)
      .then((res) => res.data);
  });

  // ...
};

export default ComprasLista;

// Código Back-End

router.get(
  "/",
  asyncHandler(async (req, res) => {
    const keyword = req.query.keyword
      ? {
          fornecedor: {
            $regex: req.query.keyword,
            $options: "i"
          }
        }
      : {};
    const compras = await Compras.find({ ...keyword });
    res.json(compras);
  })
);
Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para utilizar la “keyword” de los parámetros en la solicitud de axios get, puedes actualizar el fragmento de código de la siguiente manera:

    const ComprasLista = () => {
  const { keyword } = useParams();

  const compras = useQuery("compras", () => {
    return axios
      .get(`https://582821e.sse.codesandbox.io/api/compras?keyword=${keyword}`)
      .then((res) => res.data);
  }, {
    enabled: Boolean(keyword)
  });

  // ...
};

    Aquí, hemos pasado un tercer parámetro al gancho useQuery, que es un objeto de opciones. En este objeto, hemos especificado la propiedad enabled como un valor booleano basado en si el keyword está disponible o no. Esto asegurará que la consulta solo se obtenga cuando el keyword esté disponible y no en la renderización inicial cuando podría ser nulo.

    También ten en cuenta que hemos eliminado el argumento ({ keyword = "" }) de la función de consulta, ya que ya no es necesario.

Comments are closed.