0
votes

Comment pousser un nouvel objet à un tableau s'il n'est pas déjà dans LocalStorage

J'essaie de mettre en œuvre une fonctionnalité simple "Ajouter à mes favoris", mais je ne peux pas vraiment faire fonctionner les choses en stockage local.

Je suis capable de pousser un objet / une matrice au stockage local et de le récupérer, mais lorsque je clique sur l'élément suivant pour "Ajouter aux favoris", je finis par écraser le précédent plutôt que d'ajouter un nouvel objet au tableau.

code ci-dessous: xxx

Comment puis-je mettre à jour le tableau si le même objet n'est pas déjà là?

javascript reactjs arrays ecmascript-6 local-storage

1 commentaires

localhost.Gettitem renvoie NULL est rien n'est là. Il suffit de vérifier avant la poussée. Aussi pas besoin de 3 premières lignes -> const stringid = json.stringify (filmid); . Créez un objet normal complet, puis avant d'ajouter sur le localhost.

3 Réponses :

1
votes

Vous pouvez probablement utiliser SET ( ) code> à la place qui vous aide à stocker des films uniques dans localtstorage code>.

Essayez comme suit: p>

p>



const stringId = '12';
const stringName = 'Name';
const stringImage = '<img-url>';

const moviesList = new Set();

const movie = {
  movieId: stringId,
  movieName: stringName,
  image: stringImage
};

moviesList.add(JSON.stringify(movie));
console.log('first attempt', JSON.parse(Array.from(moviesList)));

moviesList.add(JSON.stringify(movie));
console.log('second attempt', JSON.parse(Array.from(moviesList)));

0 commentaires

0
votes

Vérifiez si l'objet est déjà dans les films récupérés à l'aide de array.some code> et uniquement si ce n'est pas présent, poussez-le.

const retrievedMovies = localStorage.getItem("movieList");
if(retrievedMovies) {
   const parseRetrievedMovies = JSON.parse(retrievedMovies);
   console.log("retrievedMovies: ", retrievedMovies);
   console.log("parseRetrievedMovies: ", parseRetrievedMovies);
   const movieExists = parseRetrievedMovies.some((m) => movies.movieId === m.movieId ))
   if(!movieExists) {
      parseRetrievedMovies.push(movies);
   }
}

0 commentaires

0
votes

Votre fonction ne lit pas l'ancien réglage. Au lieu de cela, vous commencez par un nouveau tableau vide:

let moviesList = localStorage.getItem("movieList");

0 commentaires