Skip to main content
Version: v2

Abort Request

Receive abort for manual abort request via useHook.

// useRequest
const {
// ...
// abort function is used to abort requests
abort
} = useRequest(todoListGetter);

// useWatcher
const {
// ...
// abort function is used to abort requests
abort
} = useWatcher(todoListGetter, [page]);

Then call the abort method to abort the request.

const handleCancel = () => {
abort();
};

[2.9.0+] In react, the abort function is wrapped using useCallback, and it is not restricted by closure traps. You can use it directly in events without worrying about causing performance problems.

[2.6.2+] In addition, this abort function will also be bound to the current method instance, so requests sent through useRequest/useWatcher can also be aborted in this way.

const todoListGetter = alovaInstance.Get('todo/list');
useRequest(todoListGetter);
useWatcher(() => todoListGetter);

// Calling abort on the method can also abort the request
const handleCancel = () => {
todoListGetter.abort();
};

Therefore, if you need to abort requests in batches when certain conditions are met, you can also call abort in beforeRequest to abort requests.

const alovaInst = createAlova({
// ...
beforeRequest(method) {
if (someCondition) {
method.abort();
}
}
});