vue中如何刪除一條數(shù)據(jù)

這篇文章主要介紹“vue中如何刪除一條數(shù)據(jù)”的相關(guān)知識，小編通過實(shí)際案例向大家展示操作過程，操作方法簡單快捷，實(shí)用性強(qiáng)，希望這篇“vue中如何刪除一條數(shù)據(jù)”文章能幫助大家解決問題。

vue中刪除一條數(shù)據(jù)的方法：1、通過“arr.splice(index, 1)”方法刪除普通數(shù)組中的某一條數(shù)據(jù)；2、通過“arr.findIndex(item => {...}arr.splice(id1, 1)”方法刪除數(shù)組對象中的一條數(shù)據(jù)即可。

vue 刪除數(shù)組中的某一條數(shù)據(jù)

刪除數(shù)組中的某一條數(shù)據(jù)

刪除普通數(shù)組

let arr = [1,2,3,4,5];
 
//方法一
let index = arr.indexOf('3');
arr.splice(index, 1)
//打印結(jié)果 [1,2,4,5]
//方法二
let index = arr .findIndex(item => {
            if (item == '3') {
              return true
            }
          })
arr.splice(index, 1)
//打印結(jié)果 [1,2,4,5]

刪除數(shù)組對象

let arr = [
    {
       id:1,
       name:'張三'
    },
    {
       id:2,
       name:'李四'
    },
    {
       id:3,
       name:'王二'
    },
    {
       id:4,
       name:'麻子'
    },
];
let id1 = arr.findIndex(item => {
      if (item.id == '3') {
          return true
      }
 })
 arr.splice(id1, 1)

使用splice()刪除數(shù)組中的一個數(shù)據(jù)

1.循環(huán)輸出數(shù)組時 v-for="(item,index) in list" //需要獲取當(dāng)前下標(biāo),item

2.點(diǎn)擊刪除按鈕傳一個參數(shù) ， 在這個彈窗口方法中獲取到 這個參數(shù)。 在data中設(shè)置一個空置，把參數(shù)賦給這個值。

3.彈窗中點(diǎn)擊刪除按鈕 這個數(shù)組.splice(獲取到的下標(biāo)值，1)。

關(guān)于“vue中如何刪除一條數(shù)據(jù)”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識，可以關(guān)注億速云行業(yè)資訊頻道，小編每天都會為大家更新不同的知識點(diǎn)。