Czy to najlepszy sposób na połączenie sklepu Redux z haczykami?

Cześć, robię prostą aplikację TODY za pomocą reagujących haków podłączonych do Redux. Wzór, który stworzyłem, ale zastanawiam się, czy robię to dobrze, czy coś jest nie tak z tym podejściem, czy istnieje inny wzór?

App.jsx

  const [initialTodos, updateTodos] = useState(store.getState());

  const cleanup = store.subscribe(() => updateTodos(store.getState()));

  useEffect(() => {
    return () => cleanup();
  });

Dispasping zdarza się w innych komponentach + działa aplikacja TODO

Dziękujemy za każde wejście

0
somerberdy 26 luty 2019, 11:13

2 odpowiedzi

Najlepsza odpowiedź

Okazuje się, że lepiej jest użyć "React-Redux" connect.

const mapStateToProps = state => ({state: state})

connect(mapStateToProps)(Component)

Ponieważ połączenie automagicznie dba o sklep.Subscribe itp.

Więc upuść haczyki razem :)

-1
somerberdy 4 marzec 2019, 09:42

react-redux Pakiet obsługuje haki od V7.1. Haki Redux mogą być używane zamiast funkcji {X1}}.

Jest to przykład wdrażający licznik, w którym wartość licznika jest zarządzana przez Redux.

import React from 'react'
import { useDispatch, useSelector } from 'react-redux'

export const CounterComponent = () => {
  const dispatch = useDispatch();
  const counter = useSelector(state => state.counter);

  return (
    <div>
      <span>{counter}</span>
      <button onClick={() => dispatch({ type: 'INCREMENT_COUNTER' })}>
        Increment counter
      </button>
    </div>
  );
}

Źródło: https://react-Redux.js.org/api/Hooks

0
Hugodby 5 wrzesień 2019, 12:53