Application of methods to obtain data from other components in React

Question

I have a constant that receives a json data through fetch. The code is as follows:

const [user, setUser] = useState([]);

Asynchronous function users() { const result = wait fetch (My API `,{ })

const data = await result.json();
setUser(data);`

I want to display her data in another component, like only name or only ID.

I want to put the name in this little blue block: this is another component

More about the second component

Answer 1

The first component is the component that gets the data, and the second component is the component that displays the data, because you receive user data through props.

function FirstComponent(){
const [user, setUser] = useState([]);

 return (
   <SecondComponent user={user} />
 )
}

function SecondComponent({user}){
 console.log(user)

 return (
   //这里是你展示图片的代码
 )
}