데이터 테이블에서 선택한 행만 지우고 확인하는 방법 [중복]

Question

show-select 옵션으로 v-data 테이블을 사용하는 vue 앱이 있습니다. "취소"버튼을 사용하여 선택한 데이터 만 지우고 싶고 올바르게 수행하는 방법을 찾고 있습니다. 이미 onclick 테이블에서 모든 데이터를 지울 수 있습니다.

사진 예 : 선택한 행만 지우고 싶어요 (아이스크림 샌드위치)

내 코드는 다음과 같습니다.

표:

 <v-data-table
    v-model="selected"
    :headers="headers"
    :items="desserts"
    :single-select="singleSelect"
    item-key="name"
    show-select
    class="elevation-1"
  >
    <template v-slot:top>
      <v-switch
        v-model="singleSelect"
        label="Single select"
        class="pa-3"
      ></v-switch>
    </template>
  </v-data-table>

"취소"버튼

<v-btn class="ma-2" color="primary" @click="cancel"> Cancel </v-btn>

스크립트

 cancel() {
      
        this.desserts = [];
      
    },

Answer 1

고유 한 속성 (이 예에서는 id)을 사용하여 항목 배열에서 행을 필터링합니다.

cancel(){
    this.desserts = this.desserts.filter((e)=> {
      return e.id !== this.selected.id;
    });
  }