reactjs 如何从其他国家获取货币和语言数据API v3.1

t3irkdon  于 2023-05-06  发布在  React
关注(0)|答案(1)|浏览(136)

我正在做一个react项目。我试图使一个应用程序,有人可以找到有关任何国家的数据。我与休息国家API v3.1工作。一切都很顺利,直到我到达这里。我试图显示每个国家的货币和语言依赖。但问题是,语言和货币数据存储在一个对象中,每个对象都有单独的名称。假设如果我去冰岛并尝试访问语言,我必须写data.language.isl,如果我去西班牙并尝试访问语言,我必须写data.language.spa。我也面临着同样的货币数据问题。有谁能告诉我如何访问这些数据?
这就是数据的样子= enter image description here

wkftcu5l

wkftcu5l1#

我遇到了同样的问题,我使用了Object.Values()方法。它返回一个不带键的值数组。您可以查看MDN文档以了解更多信息。但这是我的代码片段.这个应该能用顺便说一句,我用的是jsx。

import {
  useRouter
} from 'next/router';
import {
  useState
} from 'react';

const fetchData = async(url) => {
  const res = await fetch(url);
  const jsonData = await res.json();
  return jsonData;
};

const country = () => {
  const [data, setData] = useState(null);
  const router = useRouter();
  const {
    id
  } = router.query;
  fetchData(`https://restcountries.com/v3.1/name/${id}`).then((data) =>
    setData(data)
  );

  //here's the important part
  {
    data &&
      data.map(
        ({

            languages,
          },
          i
        ) => {
          const lang = Object.values(languages);
          return ( <
              p >
              <
              span className = "font-semibold" >
              Languages: {
                ' '
              } <
              /span> {
              lang.map((el, i) => ( <
                span key = {i}> {
                  ` ${el},`
                } < /span>
              ))
            } </p>
        )
      })
}

相关问题