- Tweets 7,594
- Following 381
- Followers 858
- Likes 1,437
![function Component({ id }) {
// Or const [status, setStatus] = useState('loading');
const [isLoading, setIsLoading] = useState(true);
const [user, setUser] = useState();
const [error, setError] = useState();
useEffect(() => {
let ignore = false;
setIsLoading(true);
fetch(`/api/users/${id}`)
.then((res) => {
if (!res.ok) {
throw new Error('Failed to fetch');
}
return res.json();
})
.then((jsonData) => {
if (!ignore) {
setUser(jsonData);
setError(undefined);
}
})
.catch((err) => {
if (!ignore) {
setError(err);
setUser(undefined);
}
})
.finally(() => {
if (!ignore) {
setIsLoading(false);
}
});
return () => {
ignore = true;
};
}, [id]);
// ...
}](https://venexa.site/media/GTQTiKiXcAEkrHu.jpg)
ALT function Component({ id }) { // Or const [status, setStatus] = useState('loading'); const [isLoading, setIsLoading] = useState(true); const [user, setUser] = useState(); const [error, setError] = useState(); useEffect(() => { let ignore = false; setIsLoading(true); fetch(`/api/users/${id}`) .then((res) => { if (!res.ok) { throw new Error('Failed to fetch'); } return res.json(); }) .then((jsonData) => { if (!ignore) { setUser(jsonData); setError(undefined); } }) .catch((err) => { if (!ignore) { setError(err); setUser(undefined); } }) .finally(() => { if (!ignore) { setIsLoading(false); } }); return () => { ignore = true; }; }, [id]); // ... }
![https://twitter.com/TheRealP_YAN/status/1670005437372981249
```ts twoslash
// CODE
/**
* Coerces a string, number or symbol into a number
*/
type ToNumber<T extends PropertyKey> =
T extends `${infer U extends number}` ? U : never;
/**
* Returns the indexes of an array
*/
type IndexesOfArray<T extends readonly any[]> = ToNumber<
keyof T
>;
```
```ts twoslash
type IndexesOfArray<T extends readonly any[]> = ToNumber<
keyof T
>;
type ToNumber<T extends PropertyKey> =
T extends `${infer U extends number}` ? U : never;
// ---cut---
// USAGE
const names = ["matt", "percy", "david"] as const;
type NameIndexes = IndexesOfArray<typeof names>;
// ^?
```](https://venexa.site/media/GQCn_zkX0AAaJD0.jpg)
ALT https://twitter.com/TheRealP_YAN/status/1670005437372981249 ```ts twoslash // CODE /** * Coerces a string, number or symbol into a number */ type ToNumber<T extends PropertyKey> = T extends `${infer U extends number}` ? U : never; /** * Returns the indexes of an array */ type IndexesOfArray<T extends readonly any[]> = ToNumber< keyof T >; ``` ```ts twoslash type IndexesOfArray<T extends readonly any[]> = ToNumber< keyof T >; type ToNumber<T extends PropertyKey> = T extends `${infer U extends number}` ? U : never; // ---cut--- // USAGE const names = ["matt", "percy", "david"] as const; type NameIndexes = IndexesOfArray<typeof names>; // ^? ```