Przejdź do treści

DevFAQ

React: 12 pytań
  • Jeżeli w twoim zespole pojawiłaby się osoba, która nigdy jeszcze nie miała kontaktu z hookami w Reakcie, jak byś jej wytłumaczył(a) w jaki sposób działają?

  • Tworzysz komponent wirtualnej listy (wyświetla n z ∞ elementów).

    propTypes: {
    	startIndex: PropTypes.number,
    	allItems: PropTypes.arrayOf(PropTypes.object)
    }
    

    Własność startIndex jest ustawiana przez parent component, załóżmy że na skutek przewijania kółkiem myszy.

    W render function należy dla każdego elementu dom użyć key aby pomóc algorytmowi w rekonsyliacji. Skąd brać wartość atrybutu key aby zachować minimalną ilość mutacji podczas "przewijania" - inkrementowania własności startIndex.

    A skąd key należałoby brać, gdyby lista nie była wirtualna?

  • Gdzie zastosujesz createSelector z biblioteki reselect? Jak wygląda connect() z Reduxa, jeśli selektor ma być per instancja a nie globalny?

  • Co powinien robić komponent z nieobsługiwanymi własnościami? (niewyszczególnionymi w propTypes)

  • Masz komponent listy zaznaczanej myszką. Informację o zaznaczonym elemencie oraz listę elementów zdobędziesz z redux store.

    Zaprojektuj strukturę komponentów (chodzi o List, ListItem oraz odpowiednie użycie connect z Redux). Jak może ona wyglądać, gdy spodziewasz się w liście 10 elementów, a jak będzie wyglądała gdy będzie ich 200.

    Przyjmij założenie, że w każdym elemencie listy znajduje się CheckBox z biblioteki material-ui który w componentDidUpdate wykonuje pewne operacje na DOM które zajmują 10ms.

  • Napisz higher order component, który wyświetli spinner gdy nie ma danych (np. o nazwie data) oraz przekazany komponent gdy dane są.

  • Za pomocą jakich znaczników możemy opakować zawartość wyrenderowanego komponentu jeśli nie chcemy używać tagów HTML-owych?