I'm currently working on a feature that involves removing an item from an array when it is clicked. The code I have so far looks like this:
<span @click="deleteItem(index)" v-for="(item, index) in customTaxonomies.featured" v-html="item"></span>
In my methods section, I've implemented the following function:
deleteItem: function(index) {
this.customTaxonomies.featured.splice(index, 1);
}
Although this solution works, I find myself having to hardcode the name of the array (customTaxonomies.featured) into my method. Is there a way to dynamically pass the name of the target array through the v-for loop similar to how I am passing the index?
For example:
<span @click="deleteItem(index, arrayName)" v-for="(item, index, arrayName) in customTaxonomies.featured" v-html="item"></span>
deleteItem: function(index, arrayName) {
this.arrayName.splice(index, 1);
}
Is it possible to pass the name of the array through a prop or another frontend mechanism? My ultimate goal is to be able to specify the array I want to delete from using the frontend of my application.