Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-use-cancel-token

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-use-cancel-token

A handy react hook to cancel axios requests

  • 1.0.3
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
561
decreased by-8.33%
Maintainers
1
Weekly downloads
 
Created
Source

useCancelToken

NPM Downloads JavaScript Style Guide

A handy react hook to cancel axios requests

Demo

Install

npm install --save react-use-cancel-token

Usage

useAbortController

import * as React from 'react';
import axios from 'axios';

import useAbortController from 'react-use-cancel-token';

const Example = () => {
  const { newAbortSignal, cancelPreviousRequest, isCancel } =  useAbortController();

  const handleClick = async () => {
    cancelPreviousRequest();

    try {
      const response = await axios.get('request_url', { signal: newAbortSignal() });

      if (response.status === 200) {
        // handle success
      }
    } catch (err) {
      if (isCancel(err)) return;
      console.error(err);
    }
  };

  return <button onClick={handleClick}>send request</button>;
};
Outputs
PropertyTypeDescription
controllerMutableObjectRefReference to the AbortController instance
newAbortSignal() => AbortSignalGenerate the abort signal sent in the Axios request
cancelPreviousRequest() => voidCancel any previous Axios request
isCancel() => booleanCheck if the error returned in Axios response is an abort error

useCancelToken (deprecated)

import * as React from 'react';
import axios from 'axios';

import { useCancelToken } from 'react-use-cancel-token';

const Example = () => {
  const { newCancelToken, cancelPreviousRequest, isCancel } = useCancelToken();

  const handleClick = async () => {
    cancelPreviousRequest();

    try {
      const response = await axios.get('request_url', { cancelToken: newCancelToken() });

      if (response.status === 200) {
        // handle success
      }
    } catch (err) {
      if (isCancel(err)) return;
      console.error(err);
    }
  };

  return <button onClick={handleClick}>send request</button>;
};
Outputs
PropertyTypeDescription
sourceMutableObjectRefReference to Axios cancel token source
newCancelToken() => CancelTokenGenerate the cancel token sent in the Axios request
cancelPreviousRequest() => voidCancel any previous Axios request
isCancel() => booleanCheck if the error returned in Axios response is a cancel token error

License

MIT © AXeL-dev

Keywords

FAQs

Package last updated on 11 May 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc