小编Law*_*son的帖子

我正在尝试使用 React 钩子来重建一些作为功能组件的类组件来进行获取。

我可以获取数据，这很好，但它每隔几毫秒调用一次我的 API，我只是希望它获取数据并停止，就像它在具有 componentDidMount 的类组件中一样。

我想我能明白它为什么这样做（函数内的 fetchData() 意味着它只会继续调用自己）但我不知道如何修复它。

我尝试添加一个 setInterval，更改顺序，并将 fetchData() 移到函数之外（该组件不会呈现，因为它当时是未定义的）。

const MyFunction = () => {

const [apiResponse,setApiResponse] = useState({})

  async function fetchData() {

    const res = await fetch(`http://localhost:9000/example`,{
      method: 'POST',
      mode: 'cors',
      body: JSON.stringify({date: '20190707'}),
      headers: {'content-type': 'application/json',
      credentials: 'include'
    }
    })
  res
  .json()
  .then(res => setApiResponse(res))
  }

useEffect(() => {

  fetchData();

});


var queryResult = apiResponse['units']


return (
  <React.Fragment>  
    <CardHeader color={"info"} stats icon>
    <CardIcon color={"info"}>
    <Icon>{"trending_up"}</Icon>
    </CardIcon>
    <p className={''}>Drop In</p>
      <h3 className={''}>
        {queryResult} <small>Units</small> …

请帮忙，这让我发疯了，感觉这应该很简单。

我似乎无法center在Card我尝试创建的组件中间看到图像/头像。

试了alignText，alignItems，alignContent，justify。

我什至尝试过哪个有效，但显然现在已经过时了......

import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import Typography from '@material-ui/core/Typography';
import Avatar from '@material-ui/core/Avatar';
import Dankirk from '../assets/img/dankirk.jpg'

const useStyles = makeStyles({
  card: {
    width: "100%",
    minHeight: "150px",
    borderRadius: "0px",
  },
  title: {
    fontSize: 14,
    textAlign: "center"
  },
  pos: {
    marginBottom: 12,
  },
  avatar: {
    margin: 10,
    width: 120,
    height: 120,
  }, …