I need to execute the parent function from child which is imported. Child component is my button view. Please help to find a solution in parent file:
export default function Home(props) {
function test(){
alert("asd")
}
<CardheaderSlider name="All" />
<CardheaderSlider name="English" />
<CardheaderSlider name="Mathematics" />
<CardheaderSlider name="Science" />
<CardheaderSlider name="Languages" />
<CardheaderSlider name="Activity Books" />
<CardheaderSlider name="E-Training" />
}
CardheaderSlider file
export default class CardheaderSlider extends React.Component {
render() {
return (
<Pressable style={styles.button}>
<Text style={{ color: "#fff", fontWeight: "bold" }}>{this.props.name}</Text>
</Pressable>
)
}
}
You can add onPress attribute on your child:
export default class CardheaderSlider extends React.Component {
render() {
return (
<Pressable style={styles.button} onPress={() => this.props.onPress()}>
<Text style={{ color: "#fff", fontWeight: "bold" }}>{this.props.name}</Text>
</Pressable>
)
}
And call it like:
<CardheaderSlider name="All" onPress={() => myFunction()}/>