vue 数组删除(对象)单/多条删除

发布时间 2023-09-27 14:52:12作者: 鄢宁
  dataList: [
      {
        id: '1',
        value: 'aaaa',
      },
      {
        id: '2',
        value: 'bbb',
      },
      {
        id: '3',
        value: 'ccc',
      },
      {
        id: '4',
        value: 'ddd',
      },
      {
        id: '5',
        value: 'eee',
      }
    ]


methods: {
  demo() {
    //! 删除单行数据
    const  _xId = '3'
    this.dataList = this.dataList.filter((item) => {
      return item.id !== _xId 
    })
  }
}

  

二、数组多行删除(同一数据源)
dataList: [
      {
        id: '1',
        value: 'aaaa',
      },
      {
        id: '2',
        value: 'bbb',
      },
      {
        id: '3',
        value: 'ccc',
      },
      {
        id: '4',
        value: 'ddd',
      },
      {
        id: '5',
        value: 'eee',
      }
    ]
//! 删除多行数据
      const selectData = [
        {
          id: '1',
          value: 'aaaa',
        },
        {
          id: '4',
          value: 'ddd',
        },
      ]
      let newData = this.dataList.filter(
        (a) => !selectData.some((b) => a.id === b.id)
      )