react-is-mounted-hook
TypeScript icon, indicating that this package has built-in type declarations

1.1.2 • Public • Published

react-is-mounted-hook

React hook to check if the component is still mounted

Install

// with npm
npm install react-is-mounted-hook

// with yarn
yarn add react-is-mounted-hook

How to use

import React, { useState, useEffect } from 'react';
import useIsMounted from 'react-is-mounted-hook';
import axios from 'axios';
import Loading from './loading';
import Result from './result';

const FetchComponent = () => {
  const isMounted = useIsMounted();
  const [data, setData] = useState(null);

  useEffect(() => {
    const fetchData = async () => {
      const result = await axios(
        'http://hn.algolia.com/api/v1/search?query=redux'
      );
      if (isMounted()) {
        setData(result.data);
      }
    };

    fetchData();
  }, [isMounted]);

  return data ? <Result data={data} /> : <Loading />;
};

export default FetchComponent;

License

MIT

Package Sidebar

Install

npm i react-is-mounted-hook

Weekly Downloads

34,720

Version

1.1.2

License

MIT

Unpacked Size

4.55 kB

Total Files

9

Last publish

Collaborators

  • hupe1980