sync offline actions

Sync-Line-Actions

هذه مكتبة React Native التي تم إنشاؤها للتعامل مع التزامن مع الخلفية. تخيل أن بعض الإجراءات يتم إرسالها وفي تلك اللحظة لم يكن لديك الإنترنت ، مع هذه المكتبة ، ستتمكن من التقاط تلك الوضعية ، وإنقاذ المعلومات المتعلقة بالإجراء وإرسالها مرة أخرى عند استعادة الاتصال. أفضل جزء من هذا ، هو أن هذه المكتبة سهلة الاستخدام للغاية.

ابدء

متطلبات

redux

react-redux

@react-native-community/netinfo > سيتعين عليك تثبيت هذه المكتبة من قبل ، وهنا الخطوات: معلومات صافية

@react-native-community/async-storage

تثبيت المكتبة

 yarn add sync-offline-actions

أو NPM:

 npm install --save sync-offline-actions

كيفية استخدامه

نحن نقدم أربع أدوات حتى تتمكن من التعامل مع سلوك مشروعك. هؤلاء هم:

RestoreOfflineActions

هذا مكون ، سيتعين عليك استخدامه في جذر مشروعك. من الضروري تمامًا أن تستخدم هذا المكون في جذر مشروعك لأنه يجب أن يكون موجودًا في مكون يكون دائمًا على قيد الحياة. سيتعين على هذا المكون لف المكونات الأخرى التي لديك في جذر مشروعك ، على سبيل المثال:

 import { RestoreOfflineActions } from 'sync-offline-actions' ;
import actions from '@redux/some/actions' ;

// Some stuff

// Render/return
    < RestoreOfflineActions
      sections = { [
        { generalCondition : /* Condition of something */ , actions : { name : 'login' , associatedAction : actions . login } }
      ] } >
        < AppNavigator />
  </ RestoreOfflineActions >

sections الدعامة إلزامية تمامًا لاستخدام هذا. دعونا نرى الهيكل:

سوف تمرر مجموعة من أقسام التطبيق الخاص بك. يمكن أن يكون لكل قسم إجراءات متعددة تريد إرسالها إذا حدث. على سبيل المثال ، تخيل أنني أريد تعيين بعض الإجراءات لقسم Authorization تطبيقي وبعض الإجراءات لقسم App . سأقوم بتعيين الشرط لكل قسم في قيمة generalCondition . سيكون لدي صفيف مثل هذا:

 sections={[
   { generalCondition: /* Condition to know if the user is not logged in */, actions: [{ name: 'someAction', associatedAction: actions.someAction }] },
   { generalCondition: /* Condition to know if the user is logged in */, actions: [{ name: 'otherAction', associatedAction: actions.otherAction }, {name: 'otherAction2', associatedAction: actions.otherAction2 }] }
]}

كل قسم له إجراءات مرتبطة. سيكون لكل إجراء name (سنرى أهمية هذا الاسم لاحقًا) associatedAction ، سيكون هذا الأخير هو الإجراء الذي تريد إرساله عند استعادة الاتصال.

SaveActionTobesync

هذه وظيفة لإنقاذ اللحظات أو الإجراءات أو Ocurrencys التي سيتم إرسالها لاحقًا. فيما يلي بعض الأمثلة على استخدام:

 // actions.js

import { saveActionToBeSync } from 'sync-offline-actions' ;

// Some code

// Imagine that you have an action and that action which send a request to back, that action will fail and you will want to save that request to do it later. You will do

saveActionToBeSync ( 'someAction' , [ arg1 , arg2 , arg3 ] ) ;

//Thunk Action example

function myThunkActionCreator ( id , someValue ) {
 return async ( dispatch , getState ) => {
  dispatch ( { type : "REQUEST_STARTED" } ;
  let response ;
  try {
      response = myAjaxLib . post ( "/someEndpoint" , { id , data : someValue } ) ;
  } catch ( error ) {
      saveActionToBeSync ( 'someThunkAction' , [ id , someValue ] ) ; // here we register the failed event that want to dispatch when the connection is restored
      dispatch ( { type : "REQUEST_FAILED" , error } ) ;
  }
  dispatch ( { type : "REQUEST_SUCCEEDED" , payload : response } ) ;
 }
}

// redux-recompose example

login : ( authData : AuthData ) => ( {
    type : actions . LOGIN ,
    target : TARGETS . CURRENT_USER ,
    service : AuthService . login ,
    payload : authData ,
    successSelector : ( ) => null ,
    injections : [
      withPostFailure ( ( ) => {
        //Check the reason of the failure
        saveActionToBeSync ( 'login' , [ authData ] ) ;
      } )
    ]
  } ) ,

ستكون الوسيطة الأولى للطريقة هي الاسم الذي استخدمته من قبل لإعلان تصرفات الأقسام في مكون RestoreOfflineActions . ستكون الوسيطة الثانية مجموعة من arguments ، عند استعادة الاتصال ، سيتم استدعاء associatedAction المرتبط name الوسيطة الأولى بقائمة الوسيطة الثانية. إنها أكثر بساطة مما يبدو.

توصية

نوصيك أن يكون لديك ملف ثابت حيث يمكنك حفظ أسماء الإجراءات حتى تتمكن من تنظيم هذه الأسماء ، شيء من هذا القبيل:

 // some constant file
export const OFFLINE_ACTION_NAMES = {
  SOME_ACTION : "someAction" ,
  OTHER_ACTION : "otherAction" ,
} ;

مهم

سيتم حذف جميع Ocurrencys بعد استعادة الاتصال وإرسال بعض الإجراءات. لا يتم إرسال تصرفات بعض الأقسام ، وسيتم حذفها على أي حال. من فضلك ، أخبرنا من خلال مشكلة إذا كنت لا توافق على هذا السلوك.

المزيد من الأدوات

هذه الأدوات هي ميزة إضافية لهذه المكتبة ، لكنها ليست مرتبطة بالوظائف الحقيقية لهذا ، فقد تساعدك على جعل عملك أسهل.

withnetinfo

هذا مخصص لطلب حالة الاتصال. فيما يلي مثال على استخدام:

 import { withNetInfo } from "sync-offline-actions" ;

class SomeComponent extends Component {
  /*some code*/
  someMethod = ( ) => {
    const { isConnected } = this . props ;
    /*Do something*/
  } ;
}

export default withNetInfo ( SomeComponent ) ;

سيتم حقن Prop isConnected كدعم من SomeComponent بسبب المخصصات المخصصة ، وسيتم تحديث الدعامة مع تغييرات الشبكة.

Usenetinfo

هذا هو customhook مع نفس وظيفة withNetInfo ، مثال على استخدام:

 import { useNetInfo } from "sync-offline-actions" ;

const SomeFunction = ( ) => {
  const isConnected = useNetInfo ( ) ;
  // More of the function
} ;

بعد ذلك ، سيتم تحديث ISConnected مع آخر التغييرات في الاتصال.

شكرا ل

شعب @react-native-community/netinfo

المساهمة

1. شوكة
2. قم بإنشاء فرع الميزات الخاص بك ( git checkout -b my-new-feature )
3. ارتكب التغييرات الخاصة بك ( git commit -am 'Add some feature' )
4. ادفع إلى الفرع ( git push origin my-new-feature
5. إنشاء طلب سحب جديد

عن

تم إنشاء هذا المشروع من قبل فيليبي رودريغيز إستورو. يتم إدراجها من قبل:

رخصة

تتوفر أفعال Sync-Online تحت رخصة معهد ماساتشوستس للتكنولوجيا.

 Copyright (c) 2020 Felipe Rodriguez Esturo <[email protected]>

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.