2017-04-06 11 views
12

मैंने किसी अन्य क्रिया में उत्तर देने के लिए यहां getState का उपयोग करने के बारे में अन्य प्रश्नों में उत्तरदायी (या सिर्फ भ्रमित, मुझे) देखा है, या मैंने इसे कई बार देखा है जिसे इसे एंटी-पैटर्न कहा जाता है। मेरे लिए, यह बहुत अच्छा काम करता प्रतीत होता है लेकिन अगर हम getState का उपयोग नहीं कर रहे हैं तो ऐसा करने के लिए सबसे अच्छा अभ्यास क्या है?Redux Thunk अच्छा अभ्यास में getState का उपयोग कर रहा है?

मैं getState का उपयोग कर रहा हूं ताकि उपयोगकर्ता के एक सरणी से फ़िल्टर किया जा सके जो वर्तमान में कुछ नकली डेटा से जुड़ा हुआ है और एप्लिकेशन की स्थिति में खींचा जा रहा है।

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); 
     }); 
    } 
); 

और मेरी कम करने:

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; 
    } 
} 

मेरी कम करने में प्रयोग किया जाता खाते की प्रारंभिक अवस्था बस है:

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

यहाँ मेरी कार्रवाई के लिए कोड है accountCheck कार्रवाई उपयोगकर्ता को पास करती है (getState औरका उपयोग करके पाया गयाफ़ंक्शन) accountLogInSuccess में जहां reducer Object.assign के माध्यम से खाते की वर्तमान स्थिति में अपने मान जोड़ता है।

उपयोगकर्ता को मेरे आवेदन की जड़ पर नहीं लेना और फिर इसे प्रोप के माध्यम से पास करना नहीं है, रेडक्स के भीतर इसे पूरा करने और उपयोगकर्ता डेटा को राज्य में उपलब्ध कराने का सबसे अच्छा अभ्यास क्या है? फिर, getState का उपयोग थंक के भीतर मेरे लिए बहुत अच्छा काम करता है, लेकिन क्या इसका बेहतर समाधान है जिसे विरोधी पैटर्न नहीं माना जाता है?

उत्तर

12

मैंने Idiomatic Redux: Thoughts on Thunks, Sagas, Abstraction, and Reusability नामक एक विस्तारित ब्लॉग पोस्ट लिखा, जो इस विषय को विस्तार से संबोधित करता है। इसमें, मैं थंक्स की कई आलोचनाओं का जवाब देता हूं और getState का उपयोग करता हूं (Accessing Redux state in an action creator? में दान एब्रमोव की टिप्पणियों सहित)। वास्तव में, मेरी पोस्ट विशेष रूप से आपके जैसे प्रश्नों से प्रेरित थी।

एक टीएल के रूप में; मेरी पोस्ट का डीआर: मेरा मानना ​​है कि थनक्स रेडक्स अनुप्रयोगों में उपयोग के लिए एक पूरी तरह व्यवहार्य उपकरण हैं, और उनके उपयोग को प्रोत्साहित करते हैं। हालांकि कुछ मान्य चिंताओं के बारे में पता होना चाहिए कि थंक्स और सागा का उपयोग करते समय, और getState/select का उपयोग करके, इन चिंताओं को आपको थंक्स का उपयोग करने से डराना नहीं चाहिए।

संबंधित मुद्दे