Javascript Typescript：如何将函数传递到React组件？

在传递下面提到的函数时，我遇到了一些未定义的错误。我应该如何通过两个步骤将此函数传递给孩子

我的文件结构如下： Root.tsx>Integrations.tsx>GoogleFitIntegration.tsx

因此，在

Root.tsx

中，我传递了

handleGoogleFitPreferences

函数，如下所示：

    return (
      <Integrations
        handleGoogleFitPreferences={(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => 
          this.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)}
        navigation={this.props.navigation}
      />
    );
  }

  private handleGoogleFitPreferences(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean): void {
    console.log(`daily-steps: ${dailySteps}`, `sleep: ${sleep}`, `workouts: ${workouts}`);
    
  }

readonly handleGoogleFitPreferences:(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => void;

return <GoogleFitIntegration 
handleGoogleFitPreferences={(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => props.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)} 
setIsGoogleFitOpen={handleBackPress} />;

readonly handleGoogleFitPreferences:(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => void;

//state
    const [dailySteps, setDailySteps] = React.useState<boolean>(true);
    const [workouts, setWorkouts] = React.useState<boolean>(false);
    const [sleep, setSleep] = React.useState<boolean>(true);
    const [weight, setWeight] = React.useState<boolean>(false);
    const [bodyTemperature, setBodyTemperature] =
      React.useState<boolean>(false);

        <CustomButton
          width="100%"
          height={40}
          label="Save"
          onPress={() =>  props.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)}
        />

在

GoogleFitIntegration.tsx中，我得到了函数。并使用如下按钮运行它：

    return (
      <Integrations
        handleGoogleFitPreferences={(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => 
          this.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)}
        navigation={this.props.navigation}
      />
    );
  }

  private handleGoogleFitPreferences(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean): void {
    console.log(`daily-steps: ${dailySteps}`, `sleep: ${sleep}`, `workouts: ${workouts}`);
    
  }

readonly handleGoogleFitPreferences:(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => void;

return <GoogleFitIntegration 
handleGoogleFitPreferences={(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => props.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)} 
setIsGoogleFitOpen={handleBackPress} />;

readonly handleGoogleFitPreferences:(dailySteps: boolean, workouts: boolean,sleep:boolean,weight:boolean,bodyTemperature: boolean) => void;

//state
    const [dailySteps, setDailySteps] = React.useState<boolean>(true);
    const [workouts, setWorkouts] = React.useState<boolean>(false);
    const [sleep, setSleep] = React.useState<boolean>(true);
    const [weight, setWeight] = React.useState<boolean>(false);
    const [bodyTemperature, setBodyTemperature] =
      React.useState<boolean>(false);

        <CustomButton
          width="100%"
          height={40}
          label="Save"
          onPress={() =>  props.handleGoogleFitPreferences(dailySteps,workouts,sleep,weight,bodyTemperature)}
        />

readonly handleGoogleFitPreferences:（日常步骤：布尔值，训练：布尔值，睡眠：布尔值，体重：布尔值，体温：布尔值）=>void；
//陈述
常量[dailySteps，setDailySteps]=React.useState（true）；
const[workouts，setWorkouts]=React.useState（false）；
const[sleep，setSleep]=React.useState（true）；
常数[weight，setWeight]=React.useState（false）；
常数[体温，设定温度]=
React.useState（false）；
道具。掌上电脑配件偏好（每日步数、训练、睡眠、体重、体温）}
/>
能否提供有关错误的更多详细信息？您提到未定义的
错误，但在哪里发生，何时发生，等等？