如何接收更改了网址的Api数据？

debugcn 发表于 Dev

eeez针

我将从点击的帖子的ID中获取一个api，并在react-hooks中创建一个模式，我希望url的最后一部分包含id。

让URL = https://www.thecocktaildb.com/api/json/v1/1/lookup.php?i=${id}<-这部分！

我知道如何使用Params带来ID。但是不应该将其添加到路由器中。我不是在创建新页面，而是在创建模式。当我单击主页上的帖子时，出现模态。这与“路由”功能到新地址有什么不同吗？

如何根据点击的ID获取API？

import React, { useState, useEffect } from "react";
import { useParams } from "react-router-dom";
import axios from "axios";

const { id } = useParams();
const [data, setData] = useState([]);

useEffect(() => {
    let url = `https://www.thecocktaildb.com/api/json/v1/1/lookup.php?i=${id}`;
    axios
      .get(url)
      .then((res) => {
        setData(res.data.drinks);
      })
      .catch((error) => {
        console.log(error);
      });
    console.log(data);
  }, [id]);

罗宾·范·霍恩

您要查看的是route / path / url参数。尽管我不是反应专家，但快速的Google搜索确实为您带来了奇迹。

某些链接可能会为您提供所需的答案：React Router指南，中型文章，代码示例

如果问题是您需要根据单击的位置向API发送请求，则可以最好将单击的模式与它所属的ID关联起来。然后，当您单击它时，可以使用关联的ID从后端从该事物中检索完整信息。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。