react-native-use-persisted-state v1.0.2

React Native Use Persisted State

Preview

Introduce

💾 Simple persisted state in react-native

🌏 Globally accessable like redux, recoil...

🚀 No loading, Immediate synchronization

Usage

import {View, Text, Button} from 'react-native';
import {usePersistedState} from 'react-native-use-persisted-state';

const Counter = () => {
  const [count, setCount] = usePersistedState('@count', 0);

  return (
    <View>
      <Text>count : {count}</Text>
      <Button onPress={() => setCount(count + 1)} title="increment" />
      <Button onPress={() => setCount(count - 1)} title="decrement" />
    </View>
  );
};

Getting started

First, Install react-native-use-persisted-state & @react-native-async-storage/async-storage

yarn add react-native-use-persisted-state @react-native-async-storage/async-storage

Second, Pod intsall

cd ios && pod install

Third, Add provider

// App.js
...
import {PersistedStateProvider} from 'react-native-use-persisted-state' // here

const App = () => {
  return (
    <PersistedStateProvider> // here
        <.../>
    </PersistedStateProvider> // here
  );
};

API

usePersistedState

Params

usePersistedState<T>(key, initialState);

Returns

const [state, setState, clear] = usePersistedState<T>(...);