Odświeżenie komponentu

0

Mam problem z zaimplementowaniem powiadomień w Reakcie. Po kliknięciu na ikonkę z powiadomieniami otwiera się lista z linkami. Np. jeśli ktoś dodał post, to link będzie wskazywać na stronę z postami. Tylko co zrobić, jeśli użytkownik już jest na stronie z postami? Zrobienie history.push(currentRoute) nie odświeży komponentu. Dodanie parametru do ścieżki też nie. Dodanie stanu przez np. history.push(currentRoute, {date: new Date()}) też nie. window.location.reload() przeładuje całą aplikację. Trick w stylu history.push(tempRoute); setTimeout(() => history.replace(actualRoute)) powoduje słabe UX. Jak na razie w każdym zainteresowanym komponencie przekazuję location.state do useEffect jako ostatni argument. Nawet działa, ale jest to IMO brzydkie rozwiązanie. Macie jakiś pomysł? Użycie Reduxa byłoby pewnie jakimś rozwiązaniem, ale czy nie da się prościej?

1

Cóżżżżż, nie rozumiem kompletnie idei używania routera do rozwiązania tego problemu, ogólnie w Reacie ta nasza komunikacja wygląda w ten sposób:

Parent -> Child - komunikacja za pomocą propsów, prosto i przyjemnie jak przesyłamy tylko dane, gorzej jak Parent potrzebuje wywołać metodę na Child ale też się da to osiągnąć za pomocą render props

Parent <- Child - Parent przekazuje funkcję za pomocą propsa do Childa, Child wywołuje przekazaną funkcję jak chce zmienić coś u rodzica, czyli implementacja wzorca obserwator

jak rozumiem mamy taką sytuację:
c1
| -> c2 -> NotificationList
| -> c3

po zajściu czegoś w NotificationList chcemy uaktualnić c3, no to mamy 3 wyjścia

  1. lift the state up, czyli stan z NL przenosimy do komponentu c1 i i dalej go pchamy zgodnie z jednokierunkowym przepływem za pomocą propsów
  2. przesyłamy funkcję zdefiniowaną w c1 w stylu click(x) => { setState(x) } do propsa OnClick w komponencie NotificationList, który wywołuję ją gdy chce by stan rodzica się zmienił
  3. redux
0

No myślałem, że router oferuje jakąś funkcję w stylu refreshPage, którą można by wywołać po przyjściu powiadomienia i tyle. No ale jak widać nie.

Btw, Twoje podejście do Reduxa chyba się nieco zmieniło, o ile pamiętam. Co sądzisz o redux-toolkit: https://github.com/reduxjs/redux-toolkit? :P

0

Ciągle uważam że większość stron go nie potrzebuje. Natomiast jak już jest potrzeba to jak najbardziej się sprawdza.
Redux Toolkit nigdy nie używałem, wystarcza mi w zupełności kombinacja: react-redux + redux-thunk, z podpinaniem reduxa za pomocą hooków i wszystko oczywiście w typescripcie

1 użytkowników online, w tym zalogowanych: 0, gości: 1