React Native AsyncStorageセットアイテム機能

Question

アイテムリストアプリで非同期ストレージを使用しています。私が直面している問題は、2番目のアイテムを入力するまで、最初のアイテムが非同期に保存されないことです。私は反応フックの助けを借りてオブジェクトの配列を保存しています。たとえば、アイテムを1）リンゴ2）バナナとして入力すると、リンゴだけが非同期に保存され、バナナは3番目のアイテムを入力するまで保存されません。

const [getWant, setwant] = useState([]);

const saveData = async () => {
      AsyncStorage.clear()
       try {
        await AsyncStorage.setItem("@pantry102", JSON.stringify(getWant))
         console.log(getWant)
         alert('Data successfully saved')
       } catch (e) {
         alert('Failed to save the data to the storage')
       }
     }
const readData = async () => {
        try {
          const userData= await AsyncStorage.getItem("@pantry102")
          const userData2 = JSON.parse(userData)
          if (userData2 !== null) {
            console.log(userData2)
            setwant(userData2)
            
          }
        } catch (e) {
        alert('Failed to fetch the data from storage')
        }
      }
useEffect(() => {
      readData()
      }, [])

saveData関数は、テキストボックスが送信されたときに呼び出されるadditems関数内で呼び出されます

Answer 1

データを消去するのを待つのを忘れました。それは本質的に非同期でもあります。

await AsyncStorage.clear()

const saveData = async () => {
  try {
    await AsyncStorage.clear();
    await AsyncStorage.setItem("@pantry102", JSON.stringify(getWant));
    console.log(getWant);
    alert("Data successfully saved");
  } catch (e) {
    alert("Failed to save the data to the storage");
  }
};

私は提案します、ただそれを上書きします。クリアする必要はありません。

続きを読む： https://react-native-async-storage.github.io/async-storage/docs/api#clear

:-D

Answer 2

AsyncStorageの使用をラップするオープンソースライブラリreact-native-easy-appがあり、これを介してAsncStorage内の任意のデータに同期的にアクセスできます。問題を解決できる可能性があります。以下にサンプルプログラムがあり、参照できる可能性があります。それ。コード。