He visto esta pregunta antes, pero las soluciones no me ayudaron, por eso la he vuelto a preguntar.
Actualmente, estoy almacenando valores en una matriz y esa matriz se almacena en el almacenamiento local.
este es el objeto
data.items - 0: {id: 190217270, node_id: 'MDEwOlJlcG9zaXRvcnkxOTAyMTcyNzA=', name: '3-Bit-CNC-Starter-Pack'} 1: {id: 187179414, node_id: 'MDEwOlJlcG9zaXRvcnkxODcxNzk0MTQ=', name: 'inb-go}He mapeado esto y he usado 'nombre' como valor. Estoy llamando a este valor a través de un botón usando esta función
const favs = []; function checkId(e) { if (e.target.value !== ""){ if (!favs.includes(e.target.value)){ favs.push(e.target.value); localStorage.setItem("name", JSON.stringify(favs)); console.log(favs); document.getElementById("favsarray").innerHTML = favs; } } }y para eliminar el valor del almacenamiento local, estoy usando esta función.
function removeId(e, value) { if (e.target.value !== "") { favs.pop(e.target.value); console.log(favs); document.getElementById("favsarray").innerHTML = favs; const stored = JSON.parse(localStorage.getItem("name")); delete stored[value, e.target.value]; localStorage.setItem("name", JSON.stringify(stored)); console.log(stored); } }Aunque el valor se elimina de la matriz, no se elimina del almacenamiento local.
nota al margen: estoy llamando a esta función con un botón separado.
registro de la consola
array (item is gone) [] localstorage (the value is still there) [ "Spiral-Up-Cut-Router-Bit" ]Pero si selecciono otro elemento para agregarlo al almacenamiento local, entonces se elimina el elemento anterior.
UNFAVORITE - FUNCTION REMOVEid [ "Spiral-Up-Cut-Router-Bit" ] NEW FAVORITE - FUNCTION NEWId [ "graphqless" ]Espero que esto tenga sentido, traté de agregarle detalles lo mejor posible.
La forma más sencilla es simplemente sobrescribir el elemento en localStorage. Una vez que elimine el elemento de la matriz de favs , llame a localStorage.setItem("name", JSON.stringify(favs)); de nuevo y listo.
Intente usar el método localStorage.removeItem para eliminar el elemento del almacenamiento:
function removeId(e, value) { if (e.target.value !== "") { favs.pop(); // other code here localStorage.removeItem('name'); // method to remove item from storage } }ACTUALIZAR:
Si se elimina un elemento de la matriz y queremos establecer este valor actualizado en almacenamiento local, entonces podemos simplemente actualizar este valor:
function removeId(e, value) { if (e.target.value !== "") { favs.pop(); console.log(favs); document.getElementById("favsarray").innerHTML = favs; const stored = JSON.parse(localStorage.getItem("name")); delete stored[value, e.target.value]; // this code looks very fishy - charlietfl localStorage.setItem("name", JSON.stringify(favs)); console.log(stored); } }No estoy seguro de si esto te ayudará, pero de todos modos lo comparto.
No entiendo esta parte del código mencionado anteriormente:
delete stored[value, e.target.value];¿Qué estás pasando en el valor y e.target.value ? Si es el nombre ("Spiral-Up-Cut-Router-Bit") en sí mismo, la eliminación no eliminará el valor de la matriz. Por lo general, cuando usa el operador de eliminación en la matriz JS, necesita pasar el índice del valor, no el valor en sí.
Además, cuando elimina un elemento de matriz, la longitud de la matriz no se ve afectada. Esto se mantiene incluso si elimina el último elemento de la matriz.
Cuando el operador de eliminación elimina un elemento de la matriz, ese elemento ya no está en la matriz.
Puede consultar la imagen de salida anterior, cuando eliminé los valores de la matriz usando el valor, aunque su salida es verdadera, no elimina el valor de la matriz. Pero cuando usé el valor del índice para la eliminación, eliminó el valor de la matriz.
Nota: la matriz simplemente eliminó el valor pero no borró el índice.
Tal vez, debería usar el empalme para eliminar valores específicos de la matriz y almacenar la nueva matriz en el almacenamiento.
Además, el operador de eliminación funciona bien con objetos JS. Si quieres leer más sobre esto puedes ir a este enlace.✌🏼
Eliminar usando empalme:
var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; trees.splice(3,1); console.log(trees);