Mislio sam da vezbas useNavigation hook :-)

[mi5ha]

https://github.com/milosciganovic/ByteoutDemo/blob/51a858a8e13998faa6afa4ff5609f5a73417369b/src/components/Actions.tsx#L12

Nisam lepo definisao task :-) Mislio sam da ovde koristis useNavigation hook iz Article componente da bi vezbao kako da koristis navigation objekat kad nisi u screen ekranu.

[milosciganovic]

Misli samo da u Actions iskoristim useNavigationHook i napravim navigaciju na click bez parsovanja? Ja napravio ovako kao da bude reusable :D

Jedno pitanje. Da li ima nekih problema ako hooks-eve mesamo sa klasama?

Tipa koristimo use navigation hooks i use layout i td, a na ostalim mestima koristimo class componente?

[mi5ha]

Ne bolje je ovako kako si ti napisao za ovu situaciju, napravio si Actions kompoentu koja je vise reusable, ne zavisi od react navigation uopste. Nego ja nisam smislio dobar primer da vezbas useNavigation, al znas za njega i verujem da znas da ga koristis tako da idemo dalje :-)

Hooksove ne mozes direktno da koristis iz klasa, nego wrappujes function componentu u class componentu kao ako hoces. Al nema potrebe polako cemo prelaziti na functional/hooks.

Il nisam razumeo. Mislis da li class omcponenta moze da embeduje functional componentu i obratno? Da moze bez ikakvih problema. Sve se to svodi na bukvalno istu stvar under the hood.

[milosciganovic]

Pa da u sustini cisto da li ima nekih problema izmedju toga. Posto nisam kombinovao nikada a na nekim mestima ih nije lose iskoristiti cak i ako smo na klasama, primer useLayout.

Ok, ja sam zapravo krenuo da menajmi i znam kako radi, vraticu na ovo prvo resenje ali samo jedno pitanje pre toga.

Da bih dobio autoComplete i td... uradio sam ovo:

`import { useNavigation } from '@react-navigation/native';
import { AllNewsStackNavScreens } from '../app/RootStackNav/HomeDrawerNav/NewsTabNav/AllNewsStackNav';

export function Actions() {
    const navigation = useNavigation<AllNewsStackNavScreens>();
.
.
.

medjutim javlja mi se error:

Type 'AllNewsStackNavScreens' does not satisfy the constraint '{ dispatch(action: NavigationAction | ((state: NavigationState) => NavigationAction)): void; navigate<RouteName extends string>(...args: [RouteName] | [...]): void; navigate<RouteName extends string>(route: { ...; } | { ...; }): void; ... 5 more ...; dangerouslyGetState(): NavigationState; } & PrivateValueStore<...>...'. Type 'AllNewsStackNavScreens' is missing the following properties from type '{ dispatch(action: NavigationAction | ((state: NavigationState) => NavigationAction)): void; navigate<RouteName extends string>(...args: [RouteName] | [...]): void; navigate<RouteName extends string>(route: { ...; } | { ...; }): void; ... 5 more ...; dangerouslyGetState(): NavigationState; }': dispatch, navigate, reset, goBack, and 4 more.

[mi5ha]

hm mozda ne trazi da se da AllNewsStackNavScreens? Koji tip tu treba da das u tom generiku? hoveruj preko useNavigation pa ce ti prikazati. Ili CTRL + click useNavigation pa vidi u dekleracionim ts fileovima.

[mi5ha]

Ne nema al nikakvih issues da kombinujes class i functional components, a useLayout mozes i preko klasa vrlo lako. Al ima brdo drugih biblioteka koje ocigledno prelaze na hookove i ceo ekosistem polako prelazi.

Recimo ovo bi voleo da pocnemo da koristimo.

https://github.com/tannerlinsley/react-query

[milosciganovic]

evo na hover: useNavigation<NavigationProp<Record<string, object | undefined>, string, NavigationState, {}, {}>>

Dakle ako sam dobro razumeo, moze string, object ili undefined?

Referenca po kojoj sam gledao je ova https://reactnavigation.org/docs/typescript/

[mi5ha]

Vidis trazi NavigationProp a ne AllNewsStackNavScreens, zato se buni

[mi5ha]

Iako imaju oni jos bugova TS delu, tesko je nesto ovako tipizirati.

[milosciganovic]

GLUP SAM! Skapirao sam cim sam opet pogledao referencu dok sam ti slao. Radi... -.-

[mi5ha]

Koristi VSC maksimalno :-) on je krenuo da se pravi kao editor za TS i podrska za isti je bas jaka

[milosciganovic]

Ok, sve jasno, Vratio sam na staro ali sam isprobao i ovaj nacim. Zatvaram ovaj :)