Necesito eliminar elementos individuales de toda la matriz en localStorage. ¿Es posible lograr eso? Probé el siguiente código. Pero está eliminando toda la lista de vigilancia. Adjunto una imagen de los elementos de almacenamiento local.
function removeFromWatchlist(par) {
localStorage.removeItem("watchList")[par];
}
Claro que puede, pero necesita actualizar el valor almacenado real; en su ejemplo, está eliminando toda la matriz almacenada.
Sin embargo, dependería exactamente de qué es par : como tiene una variedad de objetos, tendrá que decidir qué significa equal .
Por ejemplo.
function removeFromWatchlist(par) {
const list = JSON.parse(localStorage.getItem('watchList'));
const test = JSON.stringify(par);
const result = list.filter(x => JSON.stringify(x) === test);
localStorage.setItem('watchList', JSON.stringify(result));
}
Esto eliminaría todas las apariciones de cualquier par de la matriz almacenada como lista de watchList en el almacenamiento local.
Para comprender por qué esto no funciona, debe comprender cómo JS "leerá" este fragmento de código a medida que se analiza de izquierda a derecha:
localStorage.removeItem("watchList")[par]
localStorageremoveItem del paso anterior"watchList"[par] desde el regreso del paso anterior El problema aquí es que en el paso 3, todo el valor se elimina del almacenamiento local y la función removeItem devuelve undefined ( https://developer.mozilla.org/en-US/docs/Web/API/Storage/removeItem#return_value ) .
Para que funcione, debe encontrar un orden de operaciones que se ajuste a su tarea: desea modificar un valor en el almacenamiento local, por lo que debe:
Que en código se vería algo así como
const value = localStorage.getItem("watchList") // step 1
const modified = /* write your logic here */ // step 2
localStorage.setItem("watchList", modified) // step 3
Además, no olvide que lo que se almacena y se obtiene de localStorage siempre es una cadena. Entonces, si está almacenando objetos, debe JSON.parse(value) al leerlos con getItem y JSON.stringify(value) al almacenarlos con setItem .
El método removeItem() eliminaría todos los elementos de su watchList en el almacenamiento local, pero en su lugar puede encontrar el índice del parámetro par que está pasando y actualizar su matriz de watchList y actualizarla usando setItem() .
const watchList = JSON.parse(localStorage.getItem('watchList')) || [];
const index = watchList.findIndex(item => item.imdbId === par.imbdId); // in your case imbdId is unique value
if(index !== -1) {
watchList.splice(index, 1); // removes the item from watchList based on the index
localStorage.setItem('watchList', JSON.stringify(watchList)); // updateing new watchList
}