2017-04-06 21 views
12

Widziałem sprzeczne (lub tylko mylące, dla mnie) odpowiedzi w innych pytaniach dotyczących tego, czy używanie getState w ramach akcji jest dopuszczalne, czy też nie, i widziałem kilka razy, że nazywa się to anty-wzorem. Wydaje mi się, że dla mnie działa świetnie, ale jaka jest najlepsza praktyka, aby to zrobić, jeśli nie mamy używać getState?Czy używasz getState w dobrej praktyce Redux Thunk?

Używam getState w ramach thunk do filtrowania przez grupę użytkowników, która jest obecnie połączona z niektórymi próbnymi danymi i jest wciągnięta do stanu aplikacji.

Oto kod dla mojego działania:

export const accountLogInSuccess = user => ({ 
    type: types.ACCOUNT_LOG_IN_SUCCESS, 
    user, 
}); 

export const accountLogOutSuccess =() => ({ 
    type: types.ACCOUNT_LOG_OUT_SUCCESS, 
}); 

export const accountCheckSuccess =() => ({ 
    type: types.ACCOUNT_CHECK_SUCCESS, 
}); 

export const accountCheck =() => (
    (dispatch, getState) => { 
     dispatch(ajaxCallBegin()); 
     return apiAccount.accountCheck().then((account) => { 
      if (account) { 
       const user = findByUID(getState().users, account.uid); 
       dispatch(accountLogInSuccess(user)); 
       toastr.success(`Welcome ${user.nameFirst}!`); 
      } else { 
       dispatch(accountLogOutSuccess()); 
      } 
      dispatch(accountCheckSuccess()); 
     }).catch((error) => { 
      dispatch(ajaxCallError(error)); 
      toastr.error(error.message); 
      throw (error); 
     }); 
    } 
); 

A mój reduktor:

export default function reducerAccount(state = initial.account, action) { 
    switch (action.type) { 
    case types.ACCOUNT_LOG_IN_SUCCESS: 
     return Object.assign({}, state, action.user, { 
      authenticated: true, 
     }); 
    case types.ACCOUNT_LOG_OUT_SUCCESS: 
     return Object.assign({}, { 
      authenticated: false, 
     }); 
    case types.ACCOUNT_CHECK_SUCCESS: 
     return Object.assign({}, state, { 
      initialized: true, 
     }); 
    default: 
     return state; 
    } 
} 

Początkowy stan konta używanego w moim reduktora jest tak:

account: { 
    initialized: false, 
    authenticated: false, 
}, 

accountCheck akcja przechodzi użytkownika (znaleziono za pomocą getState i findByUID) do accountLogInSuccess, gdzie reduktor dodaje swoje wartości do bieżącego stanu konta poprzez Object.assign.

Zalecamy, aby użytkownik nie musiał znajdować się w katalogu głównym mojej aplikacji, a następnie przekazywać go za pośrednictwem rekwizytów, jaka jest najlepsza praktyka do wykonania tej czynności w Redux i posiadania danych użytkownika w stanie? Ponownie, używając getState w thunk działa świetnie dla mnie do tej pory, ale czy istnieje lepsze rozwiązanie tego, który nie jest uważany za anty-wzór?

Odpowiedz

12

pisałem rozszerzoną blogu o nazwie Idiomatic Redux: Thoughts on Thunks, Sagas, Abstraction, and Reusability, która rozwiązuje ten temat w szczegółach. W nim odpowiadam na kilka krytycznych uwag dotyczących trzęsień i korzystania z getState (w tym komentarzy Dana Abramova z Accessing Redux state in an action creator?). W rzeczywistości mój post został zainspirowany takimi pytaniami jak Twoja.

Jako TL; DR mojego postu: Wierzę, że łącznikami są całkowicie sprawnym narzędziem do zastosowań Redux i zachęcać do ich stosowania. Chociaż istnieją pewne ważne obawy, o których należy pamiętać podczas korzystania z Thunderbirdów i sag, i używając ich wewnątrz, obawy te nie powinny Cię odstraszyć od używania thunks.