xxxxxxxxxx
const handleClick = (data) => {
navigate("/post", {state: data});
};
// in /post page
const {state} = useState()
const fetchedData=state && state.data
//visit metakul for more help and fun
xxxxxxxxxx
// on first component
import React from "react";
import { useNavigate } from "react-router-dom";
const Component1 = () => {
const navigate = useNavigate();
return (
<button onClick={() => navigate("/store", { state: "an object or single value" })} >
Click Me
</button>
);
}
// on 2nd component
import React from "react";
import { useLocation } from "react-router-dom";
const Component1 = () => {
const data = useLocation();
console.log(data)
return (
<div>got the data</div>
);
}
xxxxxxxxxx
import React, { useEffect } from 'react';
import { useNavigate } from 'react-router-dom';
const LoginRedirect = ({ loginCount, role }) => {
const navigate = useNavigate();
useEffect(() => {
// Check login count and role here
if (loginCount === 1) {
if (role === 'customer' || role === 'technician') {
// Redirect to the appropriate form
if (role === 'customer') {
navigate('/customer-form');
} else {
navigate('/technician-form');
}
}
} else {
// Redirect to the dashboard
navigate('/dashboard');
}
}, [navigate, loginCount, role]);
// Placeholder return (not rendered in this component)
return null;
};
export default LoginRedirect;