user15404864
user15404864

Reputation:

How to pass a value from reactjs app to another reactjs app?

I have to 2 Reactjs App, I need to pass a value from my App1 to App2 using link, but I dont know how, please help me thanks.

const location = useLocation();
const tab = getUrlParameter(location.search, 'tab');

with this I am now successfully getting the data in my App1 , lets says that data is (2), the problem is when i tried to click the other tab, it doesnt work now, why?

App1

<u><a href="/student/?tab=2">View Student</a></u> // I need to pass a value to App2, the value i need to pass is 

App2 / receive value from App1

export default function BasicTabs() {
  const location = useLocation();
  const tab = getUrlParameter(location.search, 'tab'); // with this I am now successfully getting the data in my App1 , lets says that data is (2)
  const [value, setValue] = React.useState(0);

  useEffect(() => {
    if(tab !== 2 ? tab : value){
      console.log(tab)
      setValue(2)
    }else{
      setValue(0)
    }
  })

  const handleChange = (event, newValue) => {
    setValue(newValue);
  };

  return (
    <Box sx={{ width: '100%' }}>
      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
        <Tabs value={value} onChange={handleChange} aria-label="basic tabs example">
          <Tab label="Item One" {...a11yProps(0)} />
          <Tab label="Item Two" {...a11yProps(1)} />
          <Tab label="Item Three" {...a11yProps(2)} />
        </Tabs>
      </Box>
      <TabPanel value={value} index={0}>
        Item One
      </TabPanel>
      <TabPanel value={value} index={1}>
        Item Two
      </TabPanel>
      <TabPanel value={value} index={2}>
        Item Three
      </TabPanel>
    </Box>
  );
}




    

Upvotes: 1

Views: 77

Answers (1)

acconrad
acconrad

Reputation: 3209

One option is to use query string parameters. So you would do something like

https://App2Url/student/4?App1Key=App1Value

Upvotes: 1

Related Questions