Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

186
Visualizações
Formik FieldArray get values for calculations

I am using Formik with FieldArray, and passing values of Formik to another component for cross calculations,

But now the output of values are array, so how can I get access to those individual input items from an array?

import React, { useEffect } from "react";
import {TextField} from "@mui/material";

const CalculatedFieldForArray = props => {
  useEffect(() => {

    var tax = 0;

    var array = props.values.people
    
    console.log(props.values);

    array.map((out) => {

      if (out.price) {

        tax = out.price * out.country / 100;
      }
      //...Here I don't know how to assign value to FieldArray textfield
      props.setFieldValue("quantity", tax);
      
    })
    
    props.setFieldValue("quantity", tax);
  }, [props.values]);

 
  return (
    <TextField
      type="number"
      name="quantity"
      value={props.values.quantity}
    />
  );
};

export default CalculatedFieldForArray;

values which is passed by Formik is as below which shown in console, Want to access price and country value for each input and return calculation value.

{
    "people": [
        {
            "id": 0.8646983183745629,
            "price": "11",
            "country": "20"
        },
        {
            "id": 0.3192991708409705,
            "price": "110",
            "country": "18"
        }
    ],
    "quantity": 0
}
``
about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda