I got some undefined
errors when I am passing the function that I mentioned below. How should I pass this function with 2 steps to the child?
I have a file structure like this:Root.tsx > Integrations.tsx > GoogleFitIntegration.tsx
So in Root.tsx
I passed handleGoogleFitPreferences
function like below:
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}`); }
Then in Integrations.tsx
I got the func. and passed it to another child like below:
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} />;
In GoogleFitIntegration.tsx
I got the func. and run it with a button like below:
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)} />