It’s common to store the active tab like this: activeTabIndex = 0; But this...
It’s common to store the active tab like this:
activeTabIndex = 0;
But this has downsides:
🚫 What tab does each index represent?
🚫 TypeScript can't assure we specify a valid tab index.
Solution: Use a string literal type instead:
✅ The type documents the number of tabs.
✅ When we reference a tab in code, it’s clear which tab we’re referring to.
✅ The type is “narrower” than a number, so we can’t accidentally reference a tab that doesn’t exist.
Two other benefits:
✅ Get autocomplete support when referencing tabs.
✅ Can create an exhaustive switch so TypeScript catches when a case is missing!