React Native:在使用useEffect钩子获取数据时进行多次渲染

Question

我的代码有两个问题。首先是数据是未定义的，我没有从API获取数据。第二个是钩子useEffect没有像它应该的那样工作，就像componendidmount一样，它在一个循环中重新渲染组件。这是我的代码:

import { StatusBar } from 'expo-status-bar';
import React ,{useState,useEffect} from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
const [loading, setLoading] = useState(true);
const [users, setUsers] = useState([]);
const fetch = async () =>{
try{
let data = await fetch("https://api.sampleapis.com/coffee/hot", {method: 'GET'});
let json = await data.json();
setUsers(json);
setLoading(false);
}
catch(err){
console.log("Im catching the error");
console.log(err);
setUsers([]);
setLoading(false);
}

}
useEffect(() => {
fetch();
},[])

return (
<View style={styles.container}>
{loading?<><Text>Loading...</Text></>:<Text>Data fetched</Text>}
</View>
);
}

Answer 1

....    
const fetch = async () =>{
....

取回方法正在调用自己，尝试更改方法名称