useState()
hook to create a state variable that holds the error.useEffect()
hook to throw
the error whenever it's truthy.useCallback()
hook to update the state and return the cached function.const useError = err => {
const [error, setError] = React.useState(err);
React.useEffect(() => {
if (error) throw error;
}, [error]);
const dispatchError = React.useCallback(err => {
setError(err);
}, []);
return dispatchError;
};
Rconst ErrorButton = () => {
const dispatchError = useError();
const clickHandler = () => {
dispatchError(new Error('Error!'));
};
return <button onClick={clickHandler}>Throw error</button>;
};
ReactDOM.render(<ErrorButton />, document.getElementById('root'));
Subscribe to get resources directly to your inbox. You won't receive any spam! ✌️