• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Dziwna kolejność renderowania w React dla OR [React.js]

Aruba Cloud VPS - 50% taniej przez 3 miesiące!
0 głosów
333 wizyt
pytanie zadane 23 lipca 2021 w JavaScript przez Oskar Szkurłat Bywalec (2,780 p.)
zamknięte 23 lipca 2021 przez Oskar Szkurłat

Cześć,
Napotkałem taki problem i nie bardzo rozumiem skąd może wynikać. Podczas załączania strony opartej o React'a mam w głównym komponencie App prostą logikę wyboru w zależności od stanu z ciasteczek. Wykonsolowałem wartość, jaka jest w obiekcie i obiekt na każdym swoim etapie dobrze widzi wartość true z cookie.
Nie rozumiem do końca dlaczego dla następującego fragmentu kodu...

import React, { useState } from "react";
import Cookies from 'js-cookie';

function App() {
  const auth = Cookies.get('X')
  const [authorized, setAuthorized] = useState(auth)
  console.log('auth', auth, authorized) //zwraca 'auth true true' każdorazowo

return (
    <div className="App">
      {authorized === false ? (
        <PanelA />
      ) : (
        <PanelB />
      )
)
}

... działa to tak, że wpierw pomimo stanu true mi renderuje, jakby to był false (zauważalne dla oka), następnie przerenderowuje się i ustawia się poprawnie do true. Co równie ciekawe, jak zamienie kolejność na:
 

 {authorized === true ? (
        <PanelB />
      ) : (
        <PanelA />
      )

jest odwrotny problem. 

Próbowałem wcześniej wczytać już cookie na poziomie index.js i propsami przekazać i wartość domyślną stanu ustawić z propsów ale jest ten sam rezultat.

Czy ma ktoś pomysł, w jaki sposób mógłbym to naprawić? :( Z góry dzięki

komentarz zamknięcia: Sam znalazłem przyczynę.

1 odpowiedź

0 głosów
odpowiedź 23 lipca 2021 przez Oskar Szkurłat Bywalec (2,780 p.)

Nvm, okazało się, że biblioteka Cookie zwracała mi string, który był wpisywany w state, a dopiero potem był traktowany jako boolean, pomogło rzutowanie z samego początku na boolean, tzn. 


  const auth = (Cookies.get('X') === 'true')

 

Podobne pytania

0 głosów
1 odpowiedź 535 wizyt
0 głosów
1 odpowiedź 307 wizyt
0 głosów
1 odpowiedź 122 wizyt
pytanie zadane 17 marca 2016 w PHP przez niezalogowany

93,115 zapytań

142,097 odpowiedzi

321,678 komentarzy

62,453 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...