我正在使我的代码看起来更加专业,并把获取的内容移到他们自己的单独文件中,以使像我这样的新手更容易理解。我更改了一些函数的名称以匹配它们的实际功能,并开始对此进行工作。
不断返回的错误是“一个效果函数除函数外不能返回任何东西”。 我不确定要进行哪些更改以使其不再起作用。
我基本上是在尝试调用提取函数,然后在组件中使用useEffect。在它们都位于同一组件文件中之前,它可以正常工作。我不确定自己做错了什么
HeroDetail.services
import React from 'react'
export const fetchHeroDetail = async () => {
const data = await fetch(`https://api.opendota.com/api/heroStats`);
const item = await data.json();
setHero(item);
const heroId = match.params.id;
console.log(match.params.id);
const hero = item.find(element => element.id === Number(heroId));
console.log(hero);
return await setHero(hero);
};
HeroDetails组件
import React, {useState, useEffect} from "react";
import "../App.css";
import {fetchHeroDetail} from './services/HeroDetail.services'
function HeroDetail({}) {
const [hero, setHero] = useState({});
useEffect( async () => {
setHero( await fetchHeroDetail(setHero))
},[])
return(
<div>
<h1>{hero.localized_name} </h1>
<h2>{hero.move_speed}</h2>
<h2>{hero.base_health}</h2>
</div>
);
}
export default HeroDetail;