2016-05-16 14 views
7

के लिए ऑफ़लाइन समर्थन मैं एक प्रतिक्रियात्मक मूल एप्लिकेशन में ऑफ़लाइन समर्थन जोड़ना चाहता हूं। ऐप वर्तमान में एक एपीआई चलाता है जिसे पोस्टग्रेस डीबी द्वारा समर्थित किया जाता है।रिएक्ट नेटिव ऐप

मैं पहले से ही नेटइन्फो का उपयोग कर रहा हूं यह निर्धारित करने के लिए कि उपयोगकर्ता के पास कनेक्शन है या नहीं, लेकिन ऑफ़लाइन क्षमताओं को जोड़ने का सबसे अच्छा तरीका समझने के लिए देख रहा हूं, जहां कोई उपयोगकर्ता अपना डेटा और जानकारी अपडेट करना जारी रख सकता है और फिर सब कुछ सिंक हो सकता है एक कनेक्शन फिर से प्राप्त करें।

ऐसा लगता है कि एक पाउचडब/कॉचडब समाधान की अक्सर अनुशंसा की जाती है - हालांकि, मैं अपना डेटाबेस बिल्कुल बदलना नहीं चाहता हूं। आदर्श रूप में, मुझे कतार में एपीआई कॉल के "नौकरियों" को स्टोर करने के लिए कुछ प्रकार का तरीका पसंद है और फिर कनेक्शन बहाल होने के बाद उन्हें निष्पादित करना होगा।

प्रतिक्रियात्मक ऐप पर इस ऑफ़लाइन कार्यक्षमता को प्राप्त करने का सबसे अच्छा तरीका क्या है।

अग्रिम धन्यवाद!

+0

आप अपने आवेदन की स्थिति का प्रबंधन करने के लिए क्या उपयोग कर रहे हैं? –

+0

वर्तमान में फ्लक्स – Karim

+1

का उपयोग कर यदि आप Redux का उपयोग कर रहे हैं तो आप इस पुस्तकालय का उपयोग अपने राज्य को ऑफ़लाइन उपलब्ध कर सकते हैं: https://github.com/rt2zz/redux-persist –

उत्तर

4

आप उदाहरण का उपयोग कर सकते हैं सामान्य रूप से डेटा भंडारण के लिए redux।

export const LOAD_POSTS_DATA = 'LOAD_POSTS_DATA'; 
var connected = ... // filled by NetInfo 

const initialState = { 
    data: [], 
}; 

export default function reducer(state = initialState, action) { 
    switch (action.type) { 
    case LOAD_POSTS_DATA: 
     if (connected) { 
     return { 
      open: true, 
     }; 
     } 

     return state; 

    default: 
     return state; 
    } 
} 

export function load() { 
    return { 
    type: LOAD_POSTS_DATA, 
    }; 
} 

यह केवल डेटा, टाल आप की तरह एक दूसरे कम करने के लिए लिखते थे लोड नहीं होगा: मान लें कि आप एक LOAD_POSTS_DATA कार्रवाई है, जो एक घटक समय की एक बिंदु पर लागू किए जा सकते है अगर आप इस तरह आ कम करने का उपयोग कर सकते इस:

const CLEAR_QUEUE = 'CLEAR_QUEUE'; 
import { LOAD_POSTS_DATA } from './otherReducer'; 
var connected = ... // filled by NetInfo 

const initialState = { 
    queue: [], 
}; 

export default function reducer(state = initialState, action) { 
    switch (action.type) { 
    case LOAD_POSTS_DATA: 
     if (!connected) { 
     var q = state.queue; 
     q.push(action); 

     return { 
      queue: q, 
     }; 
     } 

     return state; 

    case CLEAR_QUEUE: 
     return { 
     queue: [] 
     } 

    default: 
     return state; 
    } 
} 

// needs to be called as soon as you go back only 
// requires redux-thunk 
export function getOperations() { 
    return (dispatch, getState) => { 
    const { thisReducer: { queue } } = getState(); 
    queue.forEach(action => dispatch(action)); 

    return { 
     type: CLEAR_QUEUE, 
    }; 
    }; 
} 

दूसरा एक भंडार हर deferrable कार्रवाई (अन्य reducers से आयात किए जाने की आवश्यकता है) और redux-thunk का उपयोग करता कार्यों के काबू पाने और जैसे ही उन्हें प्रेषण के रूप में आप वापस ऑनलाइन होंगे करने के लिए।

1

दायरे पर एक नज़र डालें: https://realm.io, आप इसे अपने ऐप पर डेटाबेस के रूप में उपयोग कर सकते हैं, जैसे ही आपके पास कनेक्टिविटी हो, आप डेटा को सिंक कर सकते हैं।

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