मैं एपीआई कहाँ संभाल में कॉल प्रतिक्रिया देशी और redux

Question

मैं का उपयोग कर react-native + redux + immutable

मैं इस

/src 
-/components 
-/actions (where I have action types and actions) 
-/reducers 
-/api (I'm not sure if I'm doing this right) 

ठीक तरह मेरे एप्लिकेशन संरचित एक Android ऐप्लिकेशन का निर्माण कर रहा हूँ, इसलिए मैं एक है कार्रवाई जहां मैं इस तरह लाने के साथ एक API कॉल करने के लिए की जरूरत है:

import * as types from './casesTypes' 

export function getCases() { 
    return { 
     type: types.GET_CASES 
    } 
} 

यह मामलों कम करने है:

const initialState = fromJS({ 
    isLoading: false, 
    cases: null 
}) 
export default function cases(state = initialState, action = {}) { 

    switch(action.type) { 

     case types.REQUEST_CASES: 
      return state.set('isLoading', true) 

     case types.RECIVE 
      return state.set('cases', //set here the array that I recive from api call) 

     default: 
      return state 
    } 
} 

तो, बात यह है कि मैं वास्तव में समझ नहीं पा रहा हूं, मुझे एपीआई कॉल कहां बनाना चाहिए ताकि reducer में मैं अपने शुरुआती राज्य को एपीआई कॉल से जो कुछ भी प्राप्त कर सकता हूं उसे मिला सकता हूं?

Answer 1

आपका एप्लिकेशन संरचना ध्वनि है।

मैं प्रेषण को संभालने के लिए रेडक्स-थंक के उपयोग की भी सिफारिश करता हूं। यहां बताया गया है कि यह आपके मामले में कैसे काम करेगा:

मान लें कि आपके राज्य के पेड़ के हिस्से के रूप में आपके पास 'मामले' हैं। अपने कम करने में

import * as types from './casesTypes' 

export function getCases() { 
    return fetch(...) 
      ... 
      .then((json) => { 
       dispatch({   
       type: types.RECEIVED_CASES, 
       isLoading: false, 
       cases: json, 
       } 
} 

और अब सिर्फ राज्य के पेड़ के साथ नए मामले सामने विलय करने के लिए नव भेजा कार्रवाई मिलती है:: मैं अपनी कार्रवाई में API कॉल डाल के रूप में आप का सुझाव दिया नए मामले सामने लाने के लिए

const initialState = fromJS({ 
    isLoading: false, 
    cases: null 
}) 

export default function cases(state = initialState, action = {}) { 

    switch(action.type) { 

     case types.REQUEST_CASES: 
      return state.set('isLoading', true) 

     case types.RECEIVED_CASES: 
      return Object.assign({}, state, { 
      cases: state.cases.merge(action.cases), 
      }); 

     default: 
      return state 
    } 
} 

मैं वर्तमान में इस संरचना के साथ काम कर रहा हूं और यह बहुत अच्छी तरह से काम करता है। उम्मीद है की वो मदद करदे!

Answer 2

आपको redux-thunk या redux-saga का प्रयास करना चाहिए, वे एपीआई कॉल करने जैसे असीमित क्रियाओं को संभालने के लिए बनाए गए रेडक्स मिडलवायर हैं।

बाहर की जांच इस परियोजना है कि redux-thunk प्रयोग किया है: sound-redux-native