1
votes

comment incrémenter la valeur asyncStorage à chaque lancement d'application en react-native?

À chaque lancement de l'application, je souhaite incrémenter la variable myKey d'AsyncStorage. Mais dans mon cas, la valeur ne change jamais. J'en reçois 1 à chaque lancement de l'application.

Tout le monde sait comment incrémenter la variable asyncStorage.

Voici mon code

 import React, { Component } from 'react';
 import { AsyncStorage, View, Text } from 'react-native';

 export default class App extends Component {
   constructor() {
     super();
     this.state = {
       myKey: 0
      }
    }

  componentWillMount() {
    this.saveData();
 }

 saveData() {
   AsyncStorage.setItem('myKey', this.state.myKey + 1);
   this.setState({'myKey': JSON.parse(this.state.myKey + 1)});
 }

 componentDidMount() {
   AsyncStorage.getItem('myKey').then((value) => {
    this.setState({'myKey': value});
  });
  console.log(this.state.myKey);
}

render() {
   return (
      <View>
        <Text>Hello World</Text>
     </View>
    );
  }
}

entrez la description de l'image ici a >

react-native increment asyncstorage launch

0 commentaires

3 Réponses :

1
votes

ComponentWillMount se déclenche AVANT ComponentDidMount, donc vous définissez toujours votre clé sur 1 (puisque votre state.key = 0), puis vous obtenez votre clé pour le stockage et mettez à jour votre état avec 1. De plus, vous ne pouvez enregistrer les valeurs de chaîne que dans AsyncStorage , vous devez donc d'abord faire des conversions de chaîne en int, afin de faire le calcul, puis de int en chaîne afin d'enregistrer la valeur. Je le ferais comme ci-dessous:

await componentDidMount() {
    let key = parseInt(await AsyncStorage.getItem('myKey'));
    AsyncStorage.setItem('myKey', (key + 1).toString());
});

0 commentaires

0
votes

Il semble que votre logique ne fonctionne pas. Actuellement, votre logique persistante est appelée (dans componentWillMount () ) avant la logique d'incrémentation (dans componentDidMount () ).

Cela signifie que;

votre composant déclenche componentWillMount () où il enregistre la valeur de 0 (prise depuis l'état initial) dans la clé myKey via AsyncStorage.setItem ()
après cela, le prochain hook de cycle de vie; componentDidMount () est déclenché. Ici, vous chargez la valeur de myKey via AsyncStorage.getItem () (qui a été défini sur 0 ) et l'incrémentez à 1 .

Pour résoudre ce problème, envisagez de réviser votre composant afin que la logique de chargement, d'incrémentation et de conservation de la valeur myKey soit contenue dans componentDidMount () hook de cycle de vie, comme indiqué dans le code et les commentaires ci-dessous:

 export default class App extends Component {
   constructor() {
     super();
     this.state = {
       myKey: 0
      }
    }

 componentDidMount() {

   AsyncStorage.getItem('myKey').then((value) => {

    // Parse value which is a string to number so 
    // that arithmetic can be performed in a safe
    // and predictable way
    value = parseInt(value);

    // If invalid parse result, default first value
    // to zero
    if(isNaN(value)) {
       value = 0;
    }

    // Update state
    this.setState({'myKey': value});

    // Add this to persist the incremented value for 
    // use on next launch. Format value as string with
    // "back ticks"
    AsyncStorage.setItem('myKey', `${value}`);
  });
}

render() {
   return (
      <View>
        <Text>Hello World</Text>
        <Text>${ this.state.myKey }</Text>
     </View>
    );
  }
}

0 commentaires

0
votes

Avez-vous essayé comme ci-dessous.

componentDidMount() {
   AsyncStorage.getItem('myKey').then((err, value) => {
    if (isNaN(err)) {
      if(isNaN(value)) {
        value = 0;
      } else {
        value = parseInt(value);
      }
      AsyncStorage.setItem('myKey', value + 1);
    }
  });
}

Erreur est le premier paramètre et non la valeur veuillez vérifier ici

0 commentaires