/Javascript/React/React custom hook refetch data

React custom hook refetch data

const useGetFetch(url, token, user, parser) => {
  const [state, dispatch] = useReducer(fetchReducer, initialState)
  // calling refetch will force a rerender on the hook
  const [shouldRefetch, refetch] = useState({}); 

  useEffect (() => {
    if(user){
      fetch(...)
      .then((data)=> data.json())
      .then(dispatch(...)) // setting the state here
      .catch((error) => dispatch(...)) // set error state
    }
  }, [user, shouldRefetch]); // note the dep array

 // returning the refetch functions so we can call the refetch() on modal close.
 return [state.response, state.loading, state.error, refetch];
}

To trigger

refetch({});

Source: stackoverflow.com

Similar codes

32 votes202 views4 answers
React update state array of objects
Javascript React
4 votes255 views1 answer
UseEffect with axios react
Javascript React
0 vote246 views1 answer
Tailwind intenseness react
Javascript React
0 vote277 views1 answer
Cloudinary react
Javascript React
0 vote260 views1 answer
Command reboot android app react native adb command
Javascript React
0 vote238 views2 answers
React hotjar
Javascript React
0 vote258 views1 answer
Npm react native turn by turn navigation
Javascript React
0 vote257 views1 answer
Uploading profile pic with react.js node.js express.js REST API to sqlite DB
Javascript React
21 votes242 views3 answers
Map function in react
Javascript React
0 vote260 views1 answer
. What is the use of the return function in the React Native Framework?
Javascript React