score:2
Accepted answer
paramavailability
is false
by default. useeffect
is first called after initial render. so you always redirect
.
to fix your hoc just extract checking logic to a separate function and use it to set the default state:
export default (wrappedcomponent, queryparamkey) => {
return props => {
function checkparam() {
const urlparams = new urlsearchparams(document.location.search);
const token = urlparams.get(queryparamkey);
return !!token;
}
const [ paramavailability, setparamavailability ] = usestate(checkparam());
useeffect(() => {
setparamavailability(checkparam());
});
return paramavailability ? (
<wrappedcomponent {...props} />
) : <redirect to="/404" />;
};
};
Source: stackoverflow.com
Related Query
- HOC does not set proper value
- Material UI TextField label does not move up when the value for TextField is set porgramatically
- Child component does not set the initial value passed from the parent: ReactJS
- Semantic UI React dropdown does not set the value onChange: React+ Typescript
- React hooks from does not set the value using setValue()
- set method in react hooks does not set the value
- React JS drop down does not get default selected based on value set
- Why does React rerender when the state is set to the same value the first time via an onClick event on DOM, but not react-native?
- React-select does not show the selected value in the field
- Redux Forms submit validation does not set errors messages
- React useState does not seem to accept a default value here?
- React - setting input value with JavaScript does not trigger 'onChange'
- jsdom 9.1+ does not set document.activeElement when focusing a node
- React setState does not set state during a while loop
- Updating initialValues prop on Formik Form does not update input value
- Why does React say not to set 'selected' property on <option> elements?
- Typescript does not properly infer this.props inside HOC
- Component does not receive props from getStaticProps when wrapped with HOC
- MUI-Autocomplete does not update value on select
- DropZone Does not pick up CSV files on Windows 10 and ChromeOS with MIME "text/csv" filter set
- How to set default value of props if not passed to functional component in NextJS using Typescript
- useState react hook does not set the array state
- Draft JS editor does not update it's content when its value changed by parent component?
- useImperativeHandle hook does not update the value
- useState set method not changing the value - React
- Redux Form: initialValues does not set form values
- big size of svg not working proper how to set big svg in react-pan-zoon-svg?
- React & AWS Amplify - User does not have delivery config set to turn on SMS_MFA
- Prop passed to child component does not change its value in child upon updating prop in parent
- option disabled selected not set as default value in React js dropdown
More Query from same tag
- Finding the number of rendered child components in react test using enzyme?
- React: Child component is passing it's state up to parent, but once parent has it, the parent is not updating its state
- How to render a list of formatted messages using React-Intl
- React + Firebase Component does not re-render on data change (remove)
- OpenLayers3 no refresh WMS in zoom-in
- trying to update an existing object in array of objects using react
- useContext is not displaying the updated state (when data is retrieved from firebase in useEffect hook in global file) in child component
- Setting authorization header in Fetch API
- Axios doen't send any data to php
- react cleanup in useEffect
- Reactjs - createStore can't recognize the reducer when using typescript
- jest test:coverage with react propTypes / defaultProps
- setState in React not updating my rendered catalog
- onSubmit handler not working and I can't submit/validate my Formik form in Reactjs
- Passing values from react components to constants file
- React click handlers and binding this
- How do I render an `HTMLCanvasElement` in React?
- How to migrate to v3 of react-redux-firebase
- Using conditional timer interval in React componentDidMount() not working
- how to convert each element in 2 list to separate dictionary react js
- ReactJS call parent method over two layers typescript
- Value is not updating in MaterialTable
- Plesk/React/Express - Starting point is (React) index.html. But I can't do a backend request
- React - Using a custom hook to call another hook - a clean approach?
- How to put uniqe id in Redux for every object in array?
- just select one checkbox in reactjs
- Cookies are stored with fetch but not with axios
- Next.js bundle size is exploding as a result of dynamic component lookup, how to solve?
- React : "Module not found " when importing component from a local project
- How can I redirect to previous page after login in react router?