[Solved]-How to pass json data from one component to another using functions in react-Reactjs

There are a few ways of doing this.

Lets take a look at the simplest one - state/props drilling.

Say you have 2 components - A and B in such relation that A is a parent to B.

If you want to pass data from A to B, you simply pass it through props. If you want to pass data from B to A however, you need to pass a set method as a property and then call that set method from B to set the state of A:

const A = props => {
    const [data, setData] = useState({})

    return <B setData={setData} />
}

const B = props => {
    return (<button onClick={props.setData("Data")}>Set Data!</button>)
}

If you have a more complex structure, you try to find the closest common parent (component which parents both A and B). This however goes only so far, at some point it becomes impossible to maintain and costly to perform, so you will need to apply some sort of global state management tool. Redux is the most popular choice, but Context API is easier to learn.