Currently, I am actively using vuejs 3 in conjunction with laravel.
This is the object array that I am currently working with:
[[Target]]
: Array(3)
0: Proxy(Object) {id: '96', name: 'DESINCRUSTADOR DCALUXE - HIDROCAL ELECTRONICO', category: 'ARTICULOS B'}
1: Proxy(Object) {id: '56', name: 'ECONOMIZADOR DE AGUA ROSCA HEMBRA', category: 'ARTICULOS SECUNDARIOS'}
2: Proxy(Object) {id: '291', name: 'COLECCIÓN COCINA INTERNACIONAL, ALTA GASTRONOMÍA I…UILIBRADA Y SALUDABLE. HD - 3D, 2 TOMOS+1DVD (GD)', category: 'OBRAS LITERARIAS PEQUEÑAS'}
length: 3
In addition, I have a function designed to remove elements from my table:
const removeItem = (event) => {
event.target.parentElement.parentElement.remove()
The deletion of the row works as intended, but now I need to update the content of my array, which is set as a ref([])
.
const addItemCart = ref([])
To accomplish this task, I am experimenting with the following code snippet:
let allRow = event.target.parentElement.parentElement;
let firstTd = allRow.getElementsByTagName('td')[0].textContent
addItemCart.value.forEach(element => {
if(element.id == firstTd){
for (const property in addItemCart.value) {
addItemCart.value = addItemCart.value.filter(item => addItemCart.value.id != firstTd);
}
}
});
console.log(addItemCart.value)
Initially, I fetch the tr element followed by extracting the content of the first td, which stores the ID
. Subsequently, I attempt to locate any matches within the array based on the id value and aim to eliminate them. This action is necessary as whenever I add new items using the push
function, the previously selected items persist alongside the new ones.
What approach should I take to successfully remove these items from my array?
Update:
const removeItem = (event) => {
event.target.parentElement.parentElement.remove()
let allRow = event.target.parentElement.parentElement;
let firstTd = allRow.getElementsByTagName('td')[0].textContent
addItemCart.value.forEach(element => {
if(element.id == firstTd){
if(element.id == firstTd){
for (const property in addItemCart.value) {
if(property.includes(firstTd)){
console.log("está");
}else{
console.log("no rula")
}
//addItemCart.value = addItemCart.value.filter(item => addItemCart.value.id != firstTd);
}
}
}
});
console.log(addItemCart.value)
I appreciate your assistance and apologize for any language barriers.