Revision history [back]

To transfer data in a callback function from a modal, you can create a function in the parent component and pass it as a prop to the modal component. This function will be called in the modal component whenever data needs to be transferred.

Here’s an example:

1. In the parent component, create a function to handle the data transfer:

const handleData = (data) => {
  console.log(`Data received: ${data}`);
};

1. Pass this function as a prop to the modal component:

<Modal onData={handleData} />

1. In the modal component, call the function whenever data needs to be transferred:

const handleOnSave = () => {
  const data = { name: 'John Doe', age: 25 };
  props.onData(data);
};

In this example, the handleOnSave function is called when the user clicks the “Save” button in the modal. It creates an object with some data and calls the onData function with this object as an argument. The parent component’s handleData function logs this data to the console.

By using this method, you can easily transfer data from a modal to its parent component through a callback function.