I've a React table component, which has an accordion attached to it
const ParentComponent = ({
megaDataFromAPIresponse1, megaDataFromAPIresponse2, someStaticProp1, someStaticProp2
});
console.log("megaDataFromAPIresponse1", megaDataFromAPIresponse1);
// prints value of megaDataFromAPIresponse1 properly.
const Temp=(props)=>{
console.log("props", props); //prints props that SpecialTable returns
console.log("megaDataFromAPIresponse1", megaDataFromAPIresponse1);
//expected to print megaDataFromAPIresponse1 from parentComponent.
//But prints null
//same with megaDataFromAPIresponse2. Prints null
console.log("someStaticProp1", someStaticProp1); // prints staticProp1 value
}
return <SpecialTable {...props} Accordion={Temp} />
here the Accordion gives back a callBack function which contains some props.
From above snippet you can see that Temp function is not able to access the outer variables. Can you please help me understand why?
Also, I tried to set a state variable inside the Temp when it is called, and that state is being looked upon inside dependencies of a useEffect and do an action. But setting that state on Temp call is throwing me an infinite loop - Not sure why?
Thanks in advance