清理代码,但useEffect出现错误

时间:2020-03-09 03:16:44

标签: javascript reactjs react-hooks use-effect

我正在使我的代码看起来更加专业,并把获取的内容移到他们自己的单独文件中,以使像我这样的新手更容易理解。我更改了一些函数的名称以匹配它们的实际功能,并开始对此进行工作。

不断返回的错误是“一个效果函数除函数外不能返回任何东西”。 我不确定要进行哪些更改以使其不再起作用。

我基本上是在尝试调用提取函数,然后在组件中使用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;

0 个答案:

没有答案