sync offline actions
1.0.0
นี่คือไลบรารีดั้งเดิมที่สร้างขึ้นเพื่อจัดการการซิงโครไนซ์กับแบ็กเอนด์ ลองนึกภาพว่าการกระทำบางอย่างจะถูกส่งและในช่วงเวลานั้นคุณไม่มีอินเทอร์เน็ตด้วยห้องสมุดนี้คุณจะสามารถติดตาม OCurrency นั้นได้บันทึกข้อมูลที่เกี่ยวข้องกับการกระทำและจัดส่งอีกครั้งเมื่อการเชื่อมต่อถูกกู้คืน ส่วนที่ดีที่สุดของสิ่งนี้คือห้องสมุดนี้ใช้งานง่ายมาก
redux
react-redux
@react-native-community/netinfo > คุณจะต้องติดตั้งไลบรารีนี้มาก่อนนี่คือขั้นตอน: ข้อมูลสุทธิ
@react-native-community/async-storage
yarn add sync-offline-actions
หรือ NPM:
npm install --save sync-offline-actions
เราจัดหาเครื่องมือสี่อย่างเพื่อให้คุณสามารถจัดการกับพฤติกรรมของโครงการของคุณ นั่นคือ:
นี่คือองค์ประกอบที่คุณจะต้องใช้ในรูทของโครงการของคุณ จำเป็นอย่างยิ่งที่คุณจะต้องใช้ส่วนประกอบนี้ในรูทของโครงการของคุณเพราะมันจะต้องมีอยู่ในองค์ประกอบที่มีชีวิตอยู่เสมอ ส่วนประกอบนี้จะต้องห่อส่วนประกอบอื่น ๆ ที่คุณมีในรูทของโครงการของคุณเช่น:
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 สิ่งสุดท้ายนี้จะเป็นการกระทำที่คุณต้องการส่งเมื่อการเชื่อมต่อถูกกู้คืน
นี่คือฟังก์ชั่นเพื่อบันทึกช่วงเวลาการกระทำหรือ 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 ทั้งหมดจะถูกลบหลังจากการเชื่อมต่อได้รับการกู้คืนและการกระทำบางอย่างจะถูกส่ง มันไม่ได้เป็นการกระทำของบางส่วนที่ไม่ได้ส่งพวกเขาจะถูกลบไปแล้ว โปรดแจ้งให้เราทราบผ่านปัญหาหากคุณไม่เห็นด้วยกับพฤติกรรมนี้
เครื่องมือนี้เป็นข้อดีสำหรับห้องสมุดนี้ แต่ไม่เกี่ยวข้องกับฟังก์ชั่นที่แท้จริงของสิ่งนี้พวกเขาสามารถช่วยให้คุณทำงานได้ง่ายขึ้น
นี่คือ hoc ที่จะขอสถานะของการเชื่อมต่อ นี่คือตัวอย่างของการใช้:
import { withNetInfo } from "sync-offline-actions" ;
class SomeComponent extends Component {
/*some code*/
someMethod = ( ) => {
const { isConnected } = this . props ;
/*Do something*/
} ;
}
export default withNetInfo ( SomeComponent ) ; เสา isConnected จะถูกฉีดเป็นเสาของ SomeComponent เนื่องจาก hoc withnetinfo เสาจะได้รับการปรับปรุงด้วยการเปลี่ยนแปลงเครือข่าย
นี่คือ customhook ที่มีฟังก์ชั่นเดียวกันของ withNetInfo ตัวอย่างการใช้:
import { useNetInfo } from "sync-offline-actions" ;
const SomeFunction = ( ) => {
const isConnected = useNetInfo ( ) ;
// More of the function
} ;จากนั้น ISConnected จะได้รับการอัปเดตด้วยการเปลี่ยนแปลงครั้งสุดท้ายของการเชื่อมต่อ
คนของ @react-native-community/netinfo
git checkout -b my-new-feature )git commit -am 'Add some feature' )git push origin my-new-feature ไปยังสาขาโครงการนี้ถูกสร้างขึ้นโดย Felipe Rodriguez Esturo มันเป็น mantained โดย:
Sync-Offline-Actions มีอยู่ภายใต้ใบอนุญาต MIT
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.
