不能在 React Native 中只调用一次函数？

Question

我有一个带有 GraphQL 服务器的 React Native 项目。我正在使用 Apollo Client 从我的 API 获取数据。我创建了这个简单的组件，它从路由参数中获取注册所需的所有数据（形成逐步注册）并进行突变以创建新商店。export default function AuthRegisterStore({ navigation, route }) {  const [    register,    { loading: validating, error: validationError, data: returnData },  ] = useMutation(REGISTER, { onError: (e) => Alert.alert(String(e)) });  const handleRegistration = () => {    register({      variables: {        username: route.params.username,        password: route.params.password,        latitude: route.params.latitude,        longitude: route.params.longitude,      },    });  };  handleRegistration()  if (validating) {    return <Loader />;  }  if (validationError) {    return (      <View style={styles.container}>        <Text>Error</Text>      </View>    );  }  if (returnData) {    navigation.navigate("Login", { message: "Te logueaste!" });  }  return null;}const styles = StyleSheet.create({  container: {    flex: 1,    justifyContent: "center",    alignItems: "center",  },});问题是函数handleRegistration()被一次又一次地调用，导致无限循环。我尝试过使用useEffect()，但由于某种原因它不会进行 API 调用。我错过了什么？

Answer 1

是的 -handleRegistration()现在设置为在每次重新渲染时运行。如果你使用useEffect了 ，你可能没有包含依赖数组（我稍后会告诉你），这也导致它在每次重新渲染时运行。尝试这个：

useEffect(() => {

  handleRegistration()

}, [])

注意中的空数组useEffect。这告诉 react 只运行一次。你可以省略它（就像你可能已经做过的那样），它告诉 react 在每次组件重新渲染时运行它。或者您可以将参数传递到数组中，当这些特定参数发生变化时，反应将观察并运行。