[Vuejs]-How do I delete a specific number in an Local Storage array?

by

1👍

First you need the grade to delete in delGrade(gradeToDelete) and once you have it (and its index by this.grades.indexOf(gradeToDelete)) you can work with the index.

Furthermore, I think .splice needs a deleteCount to remove the element at the index. Try changing this.grades.splice(idx); to this.grades.splice(idx, 1);

👤Argee

1👍

I’m assuming your data looks like integers in an array. In which they will be stored like the example below.

let grades = [8, 9, 5, 6, 3];
localStorage.setItem('grades', JSON.stringify(grades));

To remove a single key from the array, first parse it back to an array format and then use the Array.prototype.filter method create a new array without the grade that you want to remove.

let gradeToRemove = 5;
let storedGrades = JSON.parse(localStorage.getItem('grades'));
let newGrades = storedGrades.filter(grade => grade !== gradeToRemove);
localStorage.setItem('grades', JSON.stringify(newGrades));
👤Emiel Zuurbier

1👍

You should provide id, which you want to delete from array

 <button v-on:click="delGrade(idx)">Delete</button>

then you should receive that id and use it

    delGrade: function(idToDelete) {
      this.grades.splice(idToDelete, 1);
      localStorage.removeItem("grades"); // it is not necessary, coz you will override all key grades in next line
      localStorage.setItem("grades", this.grades);
    }
👤aleksey-exe

Leave a comment