This is my App.js
function App() {
const [patient, setPatient] = useState("1")
return (
<div className="App" >
<Router>
<Switch>
<DepNamesContext.Provider value={{patient, setPatient}} >
<Route exact path="/" >
<HomePage />
</Route>
<Route path="/EmployeeSurvey/:email/:firstName/:lastName/:code">
<NormalSurvey />
</Route>
<Route path="/VisitorSurvey/:email/:firstName/:lastName/:code" >
<VisitorSurvey />
</Route>
<Route path="/NewVisitorSurvey/:email/:firstName/:lastName/:code">
<NewVisitorSurvey />
</Route>
<Route path="/ConsentPage/:email/:firstName/:lastName/:code/:companyName">
<Consent />
</Route>
<Route path="/Pass/:code/:name/:email">
<Pass />
</Route>
<Route path="/Fail/:code">
<Fail />
</Route>
</DepNamesContext.Provider>
</Switch>
</Router>
</div>
);
}
export default App;
This is a portion from Homepage.js
import { DepNamesContext } from "./DepNamesContext"
const {setPatient,patient} = useContext(DepNamesContext);
I'd use setPatientMinor("3") and it will get updated in the homepage.js component but when I try and access patient state in VisitorSurvey.js Component, it's still the initial value of "1"