vue-options-api-best-practices
Najlepsze praktyki Vue 3 Options API z TypeScript i rozwiązaniami dla typowych pułapek
Instalacja
Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.
Instalacja
O skillu
Umiejętność zawierająca referencje do Vue 3 Options API — data(), methods, this context i integracja TypeScript. Znajdziesz tu rozwiązania dla problemów z typowaniem właściwości, metodami bez prawidłowego kontekstu, lifecycle hooks tracącymi dostęp do danych komponentu oraz stateful methods dzielącymi stan między instancjami. Każda referencja pokazuje tylko podejście Options API, bez Composition API.
Jak używać
Zainstaluj umiejętność w swoim projekcie Vue 3, dodając ją do konfiguracji agenta lub MCP servera obsługującego skills.
Gdy pracujesz nad komponentem Options API, przeszukaj dostępne referencje — na przykład jeśli chcesz włączyć type inference dla właściwości komponentu, przejdź do ts-options-api-use-definecomponent.
Jeśli masz problemy z typowaniem this context w Options API, skonsultuj ts-strict-mode-options-api, aby włączyć type safety dla dostępu do danych i metod.
Gdy piszesz metody, pamiętaj aby nie używać arrow functions — zamiast tego używaj zwykłych funkcji, aby zachować prawidłowy kontekst komponentu. Sprawdź no-arrow-functions-in-methods.
W lifecycle hooks (mounted, created, itp.) unikaj arrow functions, które tracą dostęp do this — zobacz no-arrow-functions-in-lifecycle-hooks.
Jeśli używasz debounced lub throttled funkcji, upewnij się że nie dzielą stanu między instancjami komponentu — stateful-methods-lifecycle zawiera rozwiązanie dla tego problemu.