score:1
Accepted answer
progressvalue
will be redeclared 0
each render cycle. just enqueue state updates to the progress
state.
export const search = (props) => {
const { contacts, setcontacts, onsearchcomplete } = props;
const [msgbox, setmsgbox] = usestate(null);
const [loading, setloading] = usestate(false);
const [progress, setprogress] = usestate(10);
const onsearch = async () => {
setloading(true);
setprogress(30);
try {
const searchresults = await appapi.searchmany(emails);
setprogress(80);
let userlist = [];
for (let i = 0; i < searchresults.length; i++) {
//processing the result here.
userlist = [...userlist, ..._users];
}
setprogress(95);
userlist.sort(sortbyemail);
onsearchcomplete(userlist);
} catch (err) {
console.log({ err });
setmsgbox({ message: `${err.message}`, type: 'error' });
}
setloading(false);
}
useeffect(() => {
onsearch();
}, []);
return (...);
}
Source: stackoverflow.com
Related Query
- React hook not updating after the API call
- React is not updating the UI after receiveing data from the API call (using hooks)
- Setting state not working after the first API call in react
- setState call inside a custom hook is not updating the state
- React useState hook not updating with axios call
- State not updating after axios call in react
- React state not updating after async await call
- The state variable returned after using useState react hook shows .map is not a function
- React custom hook with event listener not works while updating the state
- Testing API Call in React - State not updating
- SetState with react hook and redux after async call to axios API
- React - Redirect not working after api call
- React functional component is not rendering when updating the Sate after pushing data to array
- How to test api call in react component and expect the view change after success of api call?
- React state not updating after function call
- Socket event after API call not recording data correctly in React app
- while building infinite loading via API in REACT , the page number is not updating in console even when i scroll down a lot
- React state is not updated after dispatch call using React useContext hook
- Http request to the call to API not working in React
- Not able to set the state in the ReactJS context API after AJAX call
- ReactJS img not updating after API Call
- How to add images to React through an API call and not importing the image?
- Redux react not setting the value after action/reducer call
- React state is not being updated by my call to the API
- React not updating the render after setState
- React does not change state after updating state in usestate hook (in custom function form)
- React error .map() is not a function after updating api data
- useState not updating variable after API call
- React hook useCallback with get API call inside useEffect not behaving correctly
- React with Redux: Call a function after updating the store
More Query from same tag
- Environment variables in Typescript with Webpack
- Use gsap ScrollTrigger with React useRef() and Typescript - types not matching
- Correct way to add items to an array stored in React state with useState hook?
- Redux Form, how to set InitialValue from the components state?
- react component connected, redux state changes... but no update to component?
- Redux - Asynchronous response from web socket request
- [REACT]Material-ui multiple snackbar
- Why is only the last input value displayed on screen?
- Updating the state of a object in a map function
- How do I conditionally render elements based off of path react.js
- Access HangFire endpoint from Visual Studio 2019 React template project
- How do I find out what code is causing JavaScript heap out of memory
- React typescript snowpack - can't import .webp
- Is this good practice for useEffect async
- React markdown - how to get nth-element and append another element using react-markdown or dangerouslySetInnerHTML?
- Why does the problem occur even though post.Images [0] exists? TypeError: Cannot read property '0' of undefined
- How to handle two menus in one react application
- Take Image from API and store it in a object
- Material-UI AutoComplete Grouping logic does not honor duplicates
- How to create one Custom MUI Color palette for whole App?
- How to create a stopwatch in React using useReducer hook and setInterval?
- this.props.dispatch is not a function
- How to make a message disappear after a couple seconds elapse
- Is Angular 2 stable and mature enough to deploy in production?
- useEffect getting called twice in react v18
- responsive image in React
- React displaying message after submitting the form
- Wait for all promises to resolve before updating state and redirect
- How to get values from the selected radio button in react js
- nodejs mongoDB connection login page