Guide to Pass Data Between Child and Parent in React Native

To update the parent state from a child component in React-Native, you can create a function in the parent component that updates the state. Then, pass this function to the child component as a prop. When the child component needs to update the parent state, it can call this prop function.

const Child = ({ onUpdate }) => {
return (
<TouchableOpacity onPress={onUpdate.bind(this, "Child Data")}>
<Text>{"Press here for update!"}</Text>
</TouchableOpacity>
)
}

const Parent = () => {

/** State */
const [data, setData] = useState()

/** State Handler */
const onChildPress = (childData) => setData(childData)

return (
<View>
<Text>{`Parent data: ${data}`}</Text>
<Child onUpdate={onChildPress} />
</View>
)
}