CODEWITHSUNDEEP
vue.jsvuejs2vue-componentquasar-frameworkquasar
Ali Hallaji
Ali Hallaji

Reputation: 4392

Remove specific row from Quasar's table

I read the documentation of Quasar but I didn't see any instruction to remove a specific row from a table. For example, how can I remove the selected row from its table? I want to know how can to do it in the script part, not in the HTML segment.

Upvotes: 1

Views: 3961

Answers (2)

balan kugan
balan kugan

Reputation: 99

you can use splice() . other methods like pop(), remove() is not correct for expectation

Upvotes: 0

Pratik Patel
Pratik Patel

Reputation: 6978

You can use splice by using index of a row to remove the row.

methods:{
    deleteSelected(){
      let self = this;
      this.selected.filter(function(item){
        self.data.splice(self.data.indexOf(item), 1);
        return item;
      });
      this.selected = [];
    },
    deleteval(index){
      console.log(index)
      this.data.splice(index, 1);

      console.log(this.data)
    }
  }

<template v-slot:top-right>
        <q-btn
          color="primary"
          icon-right="delete_forever"
          no-caps
          @click="deleteSelected"
        />
      </template>
       <template v-slot:body-cell-action="props">
        <q-td :props="props">
          <q-btn
          color="negative"
          icon-right="delete"
          no-caps
          flat
          dense
          @click="deleteval(data.indexOf(props.row))"
        />
        </q-td>
      </template>

Working codepen - https://codepen.io/Pratik__007/pen/eYNvvva?editable=true&editors=101

Upvotes: 4

Related Questions