Odwołanie się właściwości starszego Komponentu w React

Odwołanie się właściwości starszego Komponentu w React
adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:około godziny
  • Postów:327
0

Cześć.

Prosty problem w React'ie .
Mam komponent powiedzmy Brick którego rodzicem jest komponent Wall a on jest synem Building.
Gdy w Brick użyję document.getElementsByTagName(' ')[0] to szuka mi go w Brick a nie w Wall lub Building

  1. Chcę z poziomu Brick pobrać width i height sekcji <nav> w Building. Jak mogę to zrobić?
  2. Chcę z poziomu Brick pobrać background-color diva w Brick który jest określony w pliku index.css. Jak to zrobić?
SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0

Ale po co tak to komplikowac? Nie lepiej w "buidling" zrobic "state" i przekazac to w "propsach" do "brick"?

edytowany 2x, ostatnio: SushiTrash
adams0
Myślałem że w state powinny być rzeczy które się zmieniają. Ale mogę się mylić.
SushiTrash
SushiTrash
Zasada jest taka: state mozna edytowac i zmieniac a propsow sie nie rusza. To nie znaczy ze jesli state nigdy sie nie zmieniaja to ich nie mozna wykorzystywac
LukeJL
ale jeśli się nigdy nie zmieniają to po co w ogóle state? Przecież, żeby przekazać coś z komponentu A do komponentu B nie trzeba tworzyć stanu.
LukeJL
  • Rejestracja:około 11 lat
  • Ostatnio:około 4 godziny
  • Postów:8423
0

Gdy w Brick użyję document.getElementsByTagName(' ')[0] to szuka mi go w Brick a nie w Wall lub Building

Tzn. jaki masz powód, żeby w ogóle używać document.getElementsByTagName? Bo to sprzeczne z duchem React. Z drugiej strony czasem trzeba użyć zwykłego DOM (np. żeby zintegrować komponent z zewnętrzną biblioteką, która działa na DOM), więc możliwe, że faktycznie masz konkretny powód. Ale jaki dokładnie?

Chcę z poziomu Brick pobrać width i height sekcji <nav> w Building. Jak mogę to zrobić?

Chcę z poziomu Brick pobrać background-color diva w Brick który jest określony w pliku index.css. Jak to zrobić?

Wydaje mi się, że to jednak nie są dobre powody. Zamiast działać na komponentach (wyższa abstrakcja niż "div" czy "nav") i na danych ("single source of truth") i korzystać z tego co dał ci React (props, state, context - a nawet jakbyś chciał operować na DOM, jeśli juz nie ma innej opcji, to masz tzw. refs https://reactjs.org/docs/refs-and-the-dom.html ), to i tak piszesz kod w taki sposób, jakbyś pisał go bez Reacta. To po co React?

Tzn. tak jak napisałem, różne mogą być sytuacje i czasem się opłaca "wyjść z Reacta", ale mam wrażenie, że nie w tym przypadku.


edytowany 1x, ostatnio: LukeJL
adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:około godziny
  • Postów:327
0

Ja jak najbardziej chcę używać React'a.
Nic mnie nie zmusza do używania zamienników.
Nie wiem po prostu jak po wyrenderowaniu Komponentu który ma w sobie np. <nav> pobrać jego szerokość w "px" (a ta jest zależna od ekranu).

SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0

Pewnie chcesz cos wystylowac tylko nie wiesz jak. To nie jest zadanie reacta. Tutaj masz problem z css'em. Mozna wykorzystac jakis preprocessor (scss, less). One umozliwiaja tworzenie zmiennych wlasnie typu szerokosc ekranu. Tylko pytanie czy to ci jest potrzebne. Moze wystarczy komponentowi "matka" dac width 100% i na tej zasadzie wszystko stylowac?

edytowany 1x, ostatnio: SushiTrash
adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:około godziny
  • Postów:327
0

Układ strony jest na css gridzie. Chcę w sekcji **<main> **umieścić odbijający się od boków kwadrat. Nie wiem jak to zrobić nie poznając width sekcji <main> a ona jest uzależniona od ekranu.

SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0
adams0 napisał(a):

Układ strony jest na css gridzie. Chcę w sekcji **<main> **umieścić odbijający się od boków kwadrat. Nie wiem jak to zrobić nie poznając width sekcji <main> a ona jest uzależniona od ekranu.

chcesz zrobic animacje?

SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0

mozna to zrobic tak: https://codepen.io/anon/pen/aawZKX
mozesz tez pobawic sie canvasem i zrobic animacje w js, wtedy nie powinno byc problemu z pobraniem informacji o szerokosci ekranu, zalezy jak bardzo skomplikowana ma byc ta animacja

edytowany 1x, ostatnio: SushiTrash
adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:około godziny
  • Postów:327
0

Bardzo fajna animacja. Tylko że chciałbym to pogodzić z Reactem.

edytowany 1x, ostatnio: adams0
SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0

Nie wiem czemu uwazasz ze to sie kloci z reactem.
A odpalanie na nacisnecie to tez nie problem: https://codepen.io/anon/pen/aawZKX

adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:około godziny
  • Postów:327
0

A jak uniemożliwić ponowne kliknięcie do czasu zakończenia animacji?

SushiTrash
  • Rejestracja:prawie 7 lat
  • Ostatnio:około 5 lat
  • Postów:41
0

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.