Przejdź do treści głównej
Wersja: Następna

Stan

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Istnieją dwa typy danych sterujących komponentem: props i state. props ustawiane są przez komponent nadrzędny i pozostają niezmienne przez cały cykl życia komponentu. W przypadku danych, które mają się zmieniać, musimy użyć state.

Zazwyczaj inicjalizujesz state w konstruktorze, a następnie wywołujesz setState, gdy chcesz go zmienić.

Przykładowo: załóżmy, że chcemy stworzyć tekst migający cały czas. Sam tekst jest ustawiany jednorazowo przy tworzeniu komponentu, więc stanowi prop. Natomiast informacja "czy tekst jest aktualnie widoczny, czy ukryty" zmienia się w czasie, więc powinna być przechowywana w state.

W rzeczywistych aplikacjach rzadko ustawia się stan za pomocą timera. Możesz to robić przy otrzymaniu nowych danych z serwera lub po interakcji użytkownika. Możesz także użyć kontenera stanu jak Redux czy MobX do kontroli przepływu danych. W takim przypadku modyfikujesz stan poprzez Redux lub MobX zamiast bezpośrednio wywoływać setState.

Gdy setState jest wywoływane, BlinkApp dokona ponownego renderowania swojego komponentu. Wywołując setState wewnątrz timera, komponent będzie renderowany ponownie przy każdym jego cyklu.

Stan działa identycznie jak w React, więc szczegółowe informacje znajdziesz w dokumentacji React.Component API. Prawdopodobnie zauważyłeś, że większość naszych przykładów używa domyślnego koloru tekstu. Aby go dostosować, musisz dowiedzieć się więcej o stylach.