react-native-services-xep
v0.1.14
Published
React Native common services
Downloads
14
Readme
react-native-services-xep
React Native common services
Installation
npm install react-native-services-xep
Usage
Server connection service
Import ConnectionContextWrapper in your App.tsx. Provide server side url and api url prefix. Eg: 'https://reqres.in/api/' is break down as follows...
import * as React from 'react';
import { StyleSheet, View } from 'react-native';
import { ConnectionContextWrapper } from 'react-native-services-xep';
import { Test } from './Test';
export default function App() {
return (
<View style={styles.container}>
<ConnectionContextWrapper
serverSideUrl={'https://reqres.in'}
apiPrefix={'api'}
>
<Test />
</ConnectionContextWrapper>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
});
// ... then use useConnection as a hook in a funcional component. Or you can import ConnectionContext
// to use in a class component
import React, { useEffect, FC } from 'react';
import { View, Text } from 'react-native';
import { useConnection } from 'react-native-services-xep';
export const Test: FC = () => {
const { get } = useConnection();
useEffect(() => {
console.log('test ');
get('users?page=2').then((data) => {
console.log('test ', data);
});
}, []);
return (
<View style={{ flex: 1, width: '100%', backgroundColor: 'purple'}}>
<Text>Hello</Text>
</View>
);
};
AsyncStorage
AsyncStorage is an unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
import React, { useEffect, FC } from 'react';
import { View, Text } from 'react-native';
import { AsyncStorage } from 'react-native-services-xep';
export const Test: FC = () => {
const func = async () => {
await AsyncStorage.setAsyncStorage('name', 'Xeptagon');
return await AsyncStorage.getAsyncStorage('name');
};
useEffect(() => {
func().then((r) => console.log('test ', r));
});
return (
<View style={{ flex: 1, width: '100%', backgroundColor: 'purple' }}>
<Text>Hello</Text>
</View>
);
};
License
MIT