Add example to reproduce race condition bug

example/src/pages/UseAxiosPage.tsx

@@ -7,6 +7,7 @@ import {
   UseAxiosChange,
   UseAxiosRetry,
   UseAxiosCustomInstance,
+  UseAxiosRaceCondition,
 } from '../useAxios';
 
 const UseAxiosPage: React.FC<RouteComponentProps> = () => (
@@ -16,6 +17,7 @@ const UseAxiosPage: React.FC<RouteComponentProps> = () => (
     <UseAxiosChange />
     <UseAxiosRetry />
     <UseAxiosCustomInstance />
+    <UseAxiosRaceCondition />
   </Flex>
 );
 

example/src/useAxios/RaceCondition.tsx

@@ -0,0 +1,48 @@
+import React, { useState } from 'react';
+import Container from '../Container';
+import Heading from '../Heading';
+import TextBlock from '../TextBlock';
+import { useAxios } from '../../../src';
+
+interface Data {
+  data: {
+    name: string;
+    color: string;
+  };
+}
+
+export default () => {
+  const colors = {
+    CERULEAN: 1,
+    FUCHSIA: 2,
+  };
+  const [delay, setDelay] = useState(3000);
+  const [thing, setThing] = useState(colors.CERULEAN);
+
+  const { data, error, loading } = useAxios<Data>(
+    `http://slowwly.robertomurray.co.uk/delay/${delay}/url/https://reqres.in/api/things/${thing}`
+  );
+
+  setTimeout(() => {
+    setDelay(1000);
+    setThing(colors.FUCHSIA);
+  });
+
+  return (
+    <Container>
+      <Heading>useAxios with Race Condition</Heading>
+
+      <TextBlock>
+        {loading && 'Loading...'}
+        {error && error}
+        {data && !loading && (
+          <div>
+            {data.data.name}
+            {': '}
+            {data.data.color}
+          </div>
+        )}
+      </TextBlock>
+    </Container>
+  );
+};

example/src/useAxios/index.tsx

@@ -3,3 +3,4 @@ export { default as UseAxiosCancel } from './Cancel';
 export { default as UseAxiosChange } from './Change';
 export { default as UseAxiosRetry } from './Retry';
 export { default as UseAxiosCustomInstance } from './CustomAxiosInstance';
+export { default as UseAxiosRaceCondition } from './RaceCondition';