React rendering child components with passing props to child components

So I have a workspace component, rendering child <IndividualWorkspaceOverview />,

{requested ? ( => (
      ) : (

and <IndividualWorkspaceOverview /> returns

      <button>{props.user}'s Workspace</button>

The issue comes when I want to implement where, when a user clicks on the button, it displays that user's workspace.

One solution I came up is, render only one <IndividualWorkspaceOverview />,pass the allWorkspace array to it , and set a if condition to either render buttons of a overview of workspaces, or a <IndividualWorkspace /> , set a handle click functions to those buttons and pass to each button a username as props ,when a button is clicked, the button will cause a re-render of <IndividualWorkspaceOverview /> and display <IndividualWorkspace /> associated with that buttons username.

I was wondering if there is a better way to implement this?

Read more here:

Content Attribution

This content was originally published by allen at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: