Czy dane powinny znajdować się w drzewie stanu redux?

Question

Jestem trochę zagubiony co do tego, co trzymać w drzewie stanu Redux.

Widziałem dwa sprzeczne stwierdzenia dotyczące tego, co przechowywać w drzewach stanów.

• React doc powiedzieć nam, że tylko wejściowe użytkownika powinien być przechowywany w drzewach państwowych.

oryginalna lista produktów jest przekazywana jako rekwizyty, więc że nie Państwowej. Tekst wyszukiwania i pole wyboru wydają się być stanem, ponieważ zmieniają się w czasie i nie można ich obliczyć z niczego. I wreszcie, przefiltrowana lista produktów nie jest stanem, ponieważ można ją obliczyć, łącząc oryginalną listę produktów z tekstem wyszukiwania i wartością pola wyboru.

• Redux doc mówi nam, że często należy przechowywać stan UI i dane w jednym drzewie Stan:

Dla naszej aplikacji todo, chcemy przechowywać dwie różne rzeczy:

• Aktualnie wybrany filtr widoczności;
• Rzeczywista lista todos.

Często zdarza się, że w drzewie stanów trzeba przechowywać pewne dane, a także pewien stan interfejsu użytkownika **. Jest to w porządku, ale staraj się zachować dane oddzielnie od stanu interfejsu użytkownika.

React mówi, że nie powinniśmy przechowywać danych (mówię o danych z todos) i, dla mnie, Redux mówi coś przeciwnego.

W moim zrozumieć bym raczej na boku, ponieważ oba React React i Redux dąży do przewidywania stanu UI przechowując:

1. wszystko, co nie może być obliczana (np: wszystkie wejścia człowieka) i są częścią interfejsu:

   • wartość checkbox
   • wartość wejściowa
   • wartość radiowy
   • ...

2. Wszystko minimalne dane że mogłoby być wykorzystanie do budowania zapytania i wysłać go do bazy danych API/że zwróci pełną PROFIL użytkownika, listą znajomych, cokolwiek ...:

   • ID użytkownika
   • daty utworzenia wahają
   • przedmioty Identyfikatory
   • ...

Dla mnie że wyklucza wszelką bazy danych/API wynika ponieważ:

• że stoi na poziomie danych
• mogą być obliczane poprzez wysłanie prawo (i obliczane według czystych reduktorów) zapytania.

Więc co jest tutaj swoją opinię?

Answer 1

React dokumentacja na temat Wyświetl stan komponentu, ale dokumentacja Redux dotycząca stanu aplikacji . Tak więc nie ma konfliktów między definicjami.

Jeśli mówimy o Redux - tworzysz wszystkie komponenty bez stanu (i przekształcasz bezstanowy komponent root w stanowy przy pomocy funkcji connect reakcji-redux). Jeśli masz dużą odpowiedzi z serwera i wyświetlać dane z paginacji/filtry, można traktować stanu aplikacji jak to, co widać na ekranie, a nie umieścić wszystkie dane w Redux sklepu, tylko to, co trzeba render (na przykład 100 wiersze, aby wyświetlić stronę i całkowitą liczbę wierszy do wyświetlenia w paginacji). Nie ma ograniczeń dla tego. Całe dane możesz umieścić w innym miejscu. Na przykład, w innym kontenerze danych w internetowej pracownika (robię pełny wniosek w internetowej pracownika i pobrać stamtąd tylko potrzebnych danych do wyświetlenia).

---

Dodano po pytanie edycja:

Oryginalny lista produktów jest przekazywana jako rekwizyty, więc to nie jest państwo.

W tym przykładzie powodem, dla którego lista produktów nie jest stan - jest już w props. Oznacza to, że jeden z komponentów nadrzędnych ma taki stan.

Answer 2

Uważam, że problem polega na tym, że pierwotnie Redux został mocno zepchnięty, a niektórzy ludzie byli tak puryści, że argumentowali za oddzieleniem wszystkiego od Redux i ponownym renderowaniem całego wniosku na każdą zmianę. A potem skończyło się this response twórcy, który właściwie tylko dodatkiem do nieporozumień, ponieważ Redux był i nadal jest de facto standardem dla nowych reagują aplikacje i wiele tutoriali zakładamy go.

Czuję więc, że ludzie są pod presją z każdej strony i często robią pewne rzeczy bez prawdziwego zrozumienia, dlaczego powinni (szczególnie nowi twórcy tworzący stałe, działania i reduktory). Tak więc, dla tych, którzy ją czytają, zacznijcie bez reduxa i utrzymujcie go tylko w stanie lokalnym (ale starajcie się zachować w jakimś komponencie takim jak DataContainer). Dla tych, którzy potrzebują redux, kciuk reguły polega na umieszczeniu wszystkich danych asynchronicznych (aby wszystkie żądania przechodziły przez redux) oraz danych potrzebnych dla niezależnych komponentów.Jeśli elementy znajdujące się w pobliżu znajdują się w pobliżu, zachowaj je w lokalnym stanie i przekaż jako rekwizyty.

Redux to bardzo pomocna biblioteka, ale jej moc jest potrzebna dopiero po rozpoczęciu posiadania co najmniej kilku tras, różnych opcji zapytań i skomplikowanego interfejsu użytkownika. Wcześniej istnieje duża szansa, że ​​jesteś zbyt zaawansowany (ale oczywiście, jeśli masz pewność, że przekroczysz ten rozmiar, możesz zacząć od Redux). I znowu, dosłownie nigdy nie będziesz chciał umieścić swojego slidera lub małej pozycji w sklepie - stan reaguje idealnie na to.