Category : react-router-v4

I have a code pattern that I know is not going to work but I am not able to reason it out. const MyComponent=()=>{ const history = useHistory(); function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } async function onClickHandler(){ await sleep(2000) history.push("/newRoute"); } return ( <button onClick={onClickHandler}>Click Me!!</button> ) } For code above, ..

Read more

When I run the react project by npm start in the project then the auto path is created project folder name. For example http://localhost:3002/bug-palace But after the run, it was supposed to do http://localhost:3002 shows. When I clicked Home than show me the right home path http://localhost:3002 please solve the problem, anyone. npm start (picture) ..

Read more

this function is mapping an array and I am passing index via onClick in another function and while console index I got another value from react-router in console… And I really dont know about it… const MonthName = () => { return <> {month.map((nameOfMonth , index) => <div key={index} onClick={() =>CurrentMonthDates(index)}> <Link to="/yearMonth" > <div> ..

Read more

this Component is mapping an array and I am passing index of array via onClick in another function and after console i got Object. And I really dont know about it… Here is Component const MonthName = () => { return <> {month.map((nameOfMonth , index) => <div key={index} onClick={() =>CurrentMonthDates(index)}> <Link to="/yearMonth" > <div> <h3>{nameOfMonth}</h3> ..

Read more

I want to allow routes only if the user has the appropriate role to visit them. I do the check both on the frontend and the backend, however when using Switch something is not working. {localStorage.getItem("roles") && localStorage.getItem("roles").split(",").includes("CONTRIBUTOR") && <> {/* Contributor Routes */} <Route exact path="/contributor/upload" component={ContributorUploadPage}/> <Route exact path="/contributor/edit/:rawContentId" component={ContributorEditPage}/> <Route exact path="/contributor" ..

Read more

I have to pass a function to another component using Link testFavorite=()=>{ console.log("work") } <Link to={{ pathname: ‘/popular’, state:{ testFavorite: this.testFavorite } }}> Popular</Link> This is how I call a function this.props.location.state.testFavorite(); This is giving me this error DataCloneError: Failed to execute ‘pushState’ on ‘History’: () => testFavorite() could not be cloned. Source: React Router ..

Read more