Question

0

281

Vistas

setState of multiple objects - React JS

I'm having problems when I want to update the state of an array and I am using the push() method to add the new values but apparently push does not update, so I have doubts if I can make a setState of multiple values.

Here's the code with the push() method:

buildDetailDB = () => {
    let {detail} = this.state;
    //console.log(detail)
    let dms=[];
    detail.dms.map(fabric => {
      dms.push({
        "line_id": fabric.line_id,
        "id": fabric.id,
        "dm": fabric.dm,
        "priceWhite": fabric.priceWhite,
        "priceMedium": fabric.priceMedium,
        "priceDark": fabric.priceDark,
        "priceSpecial": fabric.priceSpecial,
        "priceWhiteC": 0,
        "priceMediumC": 0,
        "priceDarkC": 0,
        "priceSpecialC": 0,
        "Blong": this.FixElementValue(fabric.Blong),
        "Bwidth": this.FixElementValue(fabric.Bwidth),
        "fabricType": fabric.fabricType,
        "weightBWashOriginal": this.FixElementValue(fabric.weightBWashOriginal),
        "weightBWashCalculated": this.FixElementValue(fabric.weightBWashCalculated),
        "dm_width": this.FixElementValue(fabric.dm_width),
        "markerWidth": this.FixElementValue(fabric.markerWidth),
        "dm_pt": fabric.dm_pt,
        "yieldydslbs": this.FixElementValue(fabric.yieldydslbs),
        "markerEfficiency": this.FixElementValue(fabric.markerEfficiency),
        "markerLong": this.FixElementValue(fabric.markerLong),
        "pieceByMarker": this.FixElementValue(fabric.pieceByMarker),
        "lbsunit": this.FixElementValue(fabric.lbsunit),
        "lbsunitwaste": this.FixElementValue(fabric.lbsunitwaste),
        "sqinchunit": this.FixElementValue(fabric.sqinchunit),
        "ydsunit": fabric.ydsunit,
        "bydspunit": this.FixElementValue(fabric.bydspunit),
        "blbspunit": this.FixElementValue(fabric.blbspunit),
      })
      console.log(fabric)
      return fabric;
    });

about 4 years ago · Juan Pablo Isaza

2 Respuestas

Responde la pregunta

0

Responde la pregunta

Encuentra empleos remotos

Answer 1 · 2022-06-30T09:07:11.127Z

I'm not entirely sure what the rest of your detail state looks like but I'm assuming it's an array of objects. Instead of destructuring your detail from state and performing updates that way, you can utilize the prevState callback that setState() offers.

The following below should pretty much get you there.

buildDetailDB = () => {
  this.setState(prevState => ({
    detail: [
      ...prevState.detail,
      {
        dms: prevState.detail.dms.map((fabric) => ({
          line_id: fabric.line_id,
          id: fabric.id,
          dm: fabric.dm,
          priceWhite: fabric.priceWhite,
          priceMedium: fabric.priceMedium,
          priceDark: fabric.priceDark,
          priceSpecial: fabric.priceSpecial,
          priceWhiteC: 0,
          priceMediumC: 0,
          priceDarkC: 0,
          priceSpecialC: 0,
          Blong: this.FixElementValue(fabric.Blong),
          Bwidth: this.FixElementValue(fabric.Bwidth),
          fabricType: fabric.fabricType,
          weightBWashOriginal: this.FixElementValue(fabric.weightBWashOriginal),
          weightBWashCalculated: this.FixElementValue(
            fabric.weightBWashCalculated
          ),
          dm_width: this.FixElementValue(fabric.dm_width),
          markerWidth: this.FixElementValue(fabric.markerWidth),
          dm_pt: fabric.dm_pt,
          yieldydslbs: this.FixElementValue(fabric.yieldydslbs),
          markerEfficiency: this.FixElementValue(fabric.markerEfficiency),
          markerLong: this.FixElementValue(fabric.markerLong),
          pieceByMarker: this.FixElementValue(fabric.pieceByMarker),
          lbsunit: this.FixElementValue(fabric.lbsunit),
          lbsunitwaste: this.FixElementValue(fabric.lbsunitwaste),
          sqinchunit: this.FixElementValue(fabric.sqinchunit),
          ydsunit: fabric.ydsunit,
          bydspunit: this.FixElementValue(fabric.bydspunit),
          blbspunit: this.FixElementValue(fabric.blbspunit),
        })),
      },
    ],
  }));
};

@eduardorh1312 Added that prevState callback parameter.

Answer 2 · 2022-06-30T09:07:11.135Z

Or another way would be to just do what you did and set the state at the end of pushing

buildDetailDB = () => {
let {detail} = this.state;
//console.log(detail)
let dms=[];
detail.dms.forEach(fabric => {
  dms.push({
    "line_id": fabric.line_id,
    "id": fabric.id,
    "dm": fabric.dm,
    "priceWhite": fabric.priceWhite,
    "priceMedium": fabric.priceMedium,
    "priceDark": fabric.priceDark,
    "priceSpecial": fabric.priceSpecial,
    "priceWhiteC": 0,
    "priceMediumC": 0,
    "priceDarkC": 0,
    "priceSpecialC": 0,
    "Blong": this.FixElementValue(fabric.Blong),
    "Bwidth": this.FixElementValue(fabric.Bwidth),
    "fabricType": fabric.fabricType,
    "weightBWashOriginal": this.FixElementValue(fabric.weightBWashOriginal),
    "weightBWashCalculated": this.FixElementValue(fabric.weightBWashCalculated),
    "dm_width": this.FixElementValue(fabric.dm_width),
    "markerWidth": this.FixElementValue(fabric.markerWidth),
    "dm_pt": fabric.dm_pt,
    "yieldydslbs": this.FixElementValue(fabric.yieldydslbs),
    "markerEfficiency": this.FixElementValue(fabric.markerEfficiency),
    "markerLong": this.FixElementValue(fabric.markerLong),
    "pieceByMarker": this.FixElementValue(fabric.pieceByMarker),
    "lbsunit": this.FixElementValue(fabric.lbsunit),
    "lbsunitwaste": this.FixElementValue(fabric.lbsunitwaste),
    "sqinchunit": this.FixElementValue(fabric.sqinchunit),
    "ydsunit": fabric.ydsunit,
    "bydspunit": this.FixElementValue(fabric.bydspunit),
    "blbspunit": this.FixElementValue(fabric.blbspunit),
  })
  this.setState({detail: {...detail, dms}})
});

0

281

setState of multiple objects - React JS

2 Respuestas

0

0

Encuentra empleos remotos

Andres GPT