Оффлайн поддержка React Native App

Question

Я ищу, чтобы добавить автономную поддержку приложения React Native. В настоящее время приложение запускает API, поддерживаемый db Postgres.

Я уже использую NetInfo, чтобы определить, есть ли у пользователя соединение или нет, но я хочу понять, как лучше использовать автономные возможности, когда пользователь может продолжать обновлять свои данные и информацию, а затем просто синхронизировать все снова подключитесь.

Похоже, что решение pouchdb/couchdb часто рекомендуется - однако я вообще не хочу менять свою базу данных. В идеале я хотел бы иметь способ сохранить «задания» вызовов API в очереди, а затем выполнить их после восстановления соединения.

Каков наилучший способ получить эту автономную функцию в приложении React Native.

Заранее благодарен!

Answer 1

Вы можете использовать, например. сокращение для хранения данных в целом. Предполагая, что у вас есть LOAD_POSTS_DATA действия, которое компонент может сгореть в момент времени, вы можете использовать аа редуктор, как это:

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

Это только не загружать данные, для отсрочки можно было бы написать второй редуктор, как это:

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

вторых хранит каждое откладываемые действие (необходимо импортировать из других восстановителей) и использует redux-thunk разжиться действий и направить их, как только вы вернулись в интернет.

Answer 2

Взгляните на область: https://realm.io, вы можете использовать ее в качестве базы данных в своем приложении, а затем, как только у вас есть возможность подключения, вы можете синхронизировать данные.