如何在javascript中使用json對象刪除json對象數組？

Question

我正在使用 react-native cli 來構建應用程序。 我已將所需的數據存儲在變量中。 為了刪除不需要的購物車，我傳遞了與元素綁定的 json 對象。 不幸的是，數據沒有被刪除。

我的數據：-

[
   {
      "ProdID":306,
      "ProdName":"Freezing Choc",
      "ProdImage":"./Source/Product/2_20190131_101857.png",
      "ProdVar":[

      ],
      "Quantity":1
   },
   {
      "ProdID":307,
      "ProdName":"Bandung",
      "ProdImage":"./Source/Product/3_20190131_101912.png",
      "ProdVar":[

      ],
      "Quantity":1
   },
   {
      "ProdID":308,
      "ProdName":"Hawaiian Breeze",
      "ProdImage":"./Source/Product/4_20190131_102006.png",
      "ProdVar":[

      ],
      "Quantity":3
   }
]

我的腳本：-

removeBtns(item) {
    return [
      {
        text: <Icon name='trash' style={{ fontSize: 15 }} />,
        onPress: () => this.Func_RemoveSelectedCart(item),
        type: 'delete',
      }
    ]
}
Func_RemoveSelectedCart = async (item) => {
    try {
      console.log('ITEM TO REMOVE: ' + JSON.stringify(item));
      await this._onAwaitAlert().then((response) => {
        if (response === 'OK') {
          delete appGlobal.ObjProduct[item];
          console.log('AFTER REMOVE: ' + JSON.stringify(appGlobal.ObjProduct));
        }
      })
        .catch(e => {
          console.log('promise catch ' + e);
        });
    } catch (e) {
      console.log('Unable to remove selected cart. ' + e);
    }
}
renderProductList() {
    var contents = this.state.prodData.map((item) => {
      return (
        <Content key={item.ProdID}>
          <Swipeout right={this.removeBtns(item)}>
            <Card>
              <CardItem>
                .
                .
                .
                .
              </CardItem>
            </Card>
          </Swipeout>
        </Content>
      );
    });
    return (
      <Content padder>
        {contents}
      </Content>
    )
}

假設我想從購物車中刪除第二個項目。 在 console.log 上，它寫道：-

要刪除的項目：{"ProdID":307,"ProdName":"Bandung","ProdImage":"./Source/Product/3_20190131_101912.png","ProdVar":[],"Quantity":1}

移除后：[{"ProdID":306,"ProdName":"冷凍巧克力","ProdImage":"./Source/Product/2_20190131_101857.png","ProdVar":[],"Quantity":1}, {"ProdID":307,"ProdName":"Bandung","ProdImage":"./Source/Product/3_20190131_101912.png","ProdVar":[],"Quantity":1},{"ProdID": 308,"ProdName":"Hawaiian Breeze","ProdImage":"./Source/Product/4_20190131_102006.png","ProdVar":[],"Quantity":3}]

我已經嘗試過基於論壇、討論、教程的搜索引擎結果：-

1： delete appGlobal.ObjProduct[item]; 什么都沒發生

2: appGlobal.ObjProduct.delete(item); 異常刪除不是函數

3: appGlobal.ObjProduct.splice(item); 它刪除 ObjProduct 中的所有數據

我不能使用ProdID刪除，因為有變體/選項可以具有相同的ProdID但不同的變體/選項。 例子：-

[
   {
      "ProdID":301,
      "ProdName":"Mango Punch",
      "ProdImage":"./Source/Product/1_20190131_1212300.png",
      "ProdVar":[],
      "Quantity":1
   },
   {
      "ProdID":305,
      "ProdName":"Berrysome-Go",
      "ProdImage":"./Source/Product/1_20190131_101800.png",
      "ProdVar":[{
         "PVID":131,
         "PVName":"Name 1"
      }],
      "Quantity":3
   },
   {
      "ProdID":305,
      "ProdName":"Berrysome-Go",
      "ProdImage":"./Source/Product/1_20190131_101800.png",
      "ProdVar":[{
         "PVID":132,
         "PVName":"Name 2"
      }],
      "Quantity":2
   },
   {
      "ProdID":305,
      "ProdName":"Berrysome-Go",
      "ProdImage":"./Source/Product/1_20190131_101800.png",
      "ProdVar":[{
         "PVID":133,
         "PVName":"Name 3"
      }],
      "Quantity":7
   }
]

Answer 1

您需要獲取ObjProduct數組中item的索引，並在刪除元素時使用它。 您不能使用item作為數組索引。

var index = appGlobal.ObjProduct.findIndex(e => e.ProdID = item.ProdID);
if (index != -1) {
    appGlobal.ObjectProduct.splice(index, 1);
} else {
    console.log("Item not found in appGlobal.ObjProduct");
}

您還應該使用splice()刪除數組元素，而不是delete ，以便重新索引數組。