प्रतिक्रिया मूल - एसिंक एक्शन

Question

के बाद नेविगेट करें मैं प्रतिक्रिया मूल और रेडक्स के साथ एक मोबाइल ऐप विकसित कर रहा हूं और मुझे सॉफ़्टवेयर डिज़ाइन समस्या का सामना करना पड़ रहा है। मैं लॉगिन के लिए एक आरईएसटी एपीआई (एसिंक ऑपरेशन) को कॉल करना चाहता हूं और उस ऑपरेशन को सफल होने पर मुख्य दृश्य पर नेविगेट करना चाहता हूं। मैं रेडक्स और थंक का उपयोग कर रहा हूं इसलिए मेरे पास पहले से ही एसिंक क्रियाएं लागू की गई हैं, इसलिए मेरा मुख्य संदेह है: मुझे मुख्य दृश्य पर नेविगेट करने के लिए तर्क कहां रखना चाहिए?

क्या मैं सीधे नेविगेटर ऑब्जेक्ट को किसी क्रिया से एक्सेस कर सकता हूं और वहां नेविगेशन कर सकता हूं? क्या मुझे लॉगिन घटक में ऐसा करना चाहिए? (जैसा कि मैं इसे पहले से कर रहा हूं - नीचे दिए गए कोड को चेक करें)।

componentWillReceiveProps(nextProps){ 
    if(nextProps.errorLoginMsg){ 
     Alert.alert("Login Failed", nextProps.errorLoginMsg); 
    } 
    else if(!nextProps.user.isNull()){ 
     this.props.navigator.replace({name: 'main'}); 
    } 
    } 

मुझे इस तर्क में घटक होने का विश्वास नहीं है। एक अच्छा अभ्यास प्रतीत नहीं होता है। क्या ऐसा करने का कोई और तरीका है?

धन्यवाद

Answer 1

यह सबसे अधिक कठिन समस्याओं में मौजूदा नेविगेटर एपीआई के साथ देशी प्रतिक्रिया से एक है। मैं एक रूट स्टोर रखने का सुझाव दूंगा जिसमें वर्तमान मार्ग है और इसमें घटक है जिसमें इस स्टोर से जुड़े नेविगेटर शामिल हैं और नेविगेशन componentWillReceiveProps पर ट्रिगर किया गया है।

Answer 2

यहाँ कोड है कैसे मैं यह कर:

   const resetAction = NavigationActions.reset({ 
        index : 0, 
        actions: [ 
         NavigationActions.navigate({ routeName: 'Home' }) 
        ] 
       }); 

       this.props.requestDeleteEvent({ 
        id: eventID 
       }).then(() => { 
        this.props.navigation.dispatch(resetAction); 
       }); 

और अंदर समारोह requestDeleteEvent:

export function requestDeleteEvent(requestData) { 
    const id = requestData.id; 

    return (dispatch, getState) => { 
     return fetch(Config.event + id, { 
      method: 'DELETE', 
      headers: { 
       'Content-Type': 'application/json; charset=UTF-8', 
      }, 
     }) 
      .then((response) => getResponseJson(response)) 
      .then((responseJson) => { 
        if (responseJson.isSuccess) { 
         return dispatch(deleteEvent(id)); 
        } 
        else { 
         return dispatch(triggerToast({type: 'alert', content: ERROR})); 
        } 
       } 
      ); 
     } 
    }