更新剩余对象的值时如何从对象中删除键值对？

Question

const initialState = {
    loading: null,
    error: null,
    lineItems: [
         {
             id: 1, 
             product_name: "Elbow 15", 
             product_disc: 1, 
             sub_total: 5548.95, 
             product_unit: "Nos", 
             …
         }
         {
             id: 2, 
             product_name: "Tee 15", 
             product_disc: 3, 
             sub_total: 24.25, 
             product_unit: "Nos", 
             …
         }
         {
             id: 3, 
             product_name: "", 
             product_disc: 0, 
             sub_total: 0
         }
    ]

lineItems代表网格中的行（我正在使用react-data-grid）

id属性值用于填充网格的第一列（“序列号”）

如果用户删除一行（例如上述情况下的中间对象）， 如何更新上述对象，因此成为

  lineItems: [
        {
            id: 1, 
            product_name: "Elbow 15", 
            product_disc: 1, 
            sub_total: 5548.95, 
            product_unit: "Nos", 
            …
        }
        {
            id: 2, 
            product_name: "", 
            product_disc: 0, 
            sub_total: 0
        }
    ]

Answer 1

您可以使用delete从对象中删除属性。然后，您需要遍历其余属性并更新其键和其中的id属性。

function removeLineItem(state, index) {
  delete state.lineItems[index];
  Object.keys(state.lineItems).forEach(k => {
    if (state.lineItems[k].id > index) {
      state.lineItems[k].id = k - 1; // decrement id
      state.lineItems[k - 1] = state.lineItems[k]; // decrement key
      delete state.lineItems[k]; // remove old key
    }
  });
}

const initialState = {
  loading: null,
  error: null,
  lineItems: {
    0: {
      id: 1,
      product_name: "Elbow 15",
      product_disc: 1,
      sub_total: 5548.95,
      product_unit: "Nos",
    },
    1: {
      id: 2,
      product_name: "Tee 15",
      product_disc: 3,
      sub_total: 24.25,
      product_unit: "Nos",
    },
    2: {
      id: 3,
      product_name: "",
      product_disc: 0,
      sub_total: 0
    }
  }
};

removeLineItem(initialState, 1);
console.log(initialState);

Answer 2

您可以使用delete关键字从对象中删除特定键。

delete object['key']