1

Tengo 2 hooks que tiene la data en formato peso Argentino:

introducir la descripción de la imagen aquí

En la funcion Calculate() tomo los valores de los state y los convierto a parseFloat para hacer un calculo de resta. La idea es guardar el resultado de la resta en el state. Pero obtengo NAN como resultado. Del codigo lo que mas importa es la funcion Calculate() donde obtengo NAN, de todas formas les muestrolo que hice:

const Home = () => {

const [stateOperations, setStateOperations] = React.useState([]);
const [incomeAmount, setIncomeAmount] = React.useState(0);
const [expensesAmount, setExpensesAmount] = React.useState(0);

const getOperations = async () => {
  const data = await operationsService.getOperationsByUser(user);
  setStateOperations(data);
  calculateAmounts(data);   
};

const calculateAmounts = (operations) => {
  let income = 0;
  let expenses = 0;
  operations.forEach(op => {
    let num = parseFloat(op.amount.toString());  
      if(op.type === 'ingreso'){   
        income += num;
      }else{
        expenses += num;
      }
    });   
    // Aca guardo en los state la data con formato peso Argenino
    setIncomeAmount(currencyFormat(income));
    setExpensesAmount(currencyFormat(expenses));  
}

const currencyFormat = (num) => {
   return Intl.NumberFormat('es-AR',{style:'currency',currency:'ARS'}).format(num);
}

// EN ESTA FUNCION OBTENGO NAN COMO RESULTADO en el console.log
const Calculate = async (amountOp, typeOp) => {
 let newTotal;
 let num = 0;
 const amount = parseFloat(amountOp);
 if(typeOp === 'ingreso'){
   num = parseFloat(incomeAmount);
   newTotal = num - amount;
   // obtengo NaN
   console.log('new resultado ingresos: ' +  newTotal);
   setIncomeAmount(currencyFormat(newTotal));
  }else{
    num = parseFloat(expensesAmount);
    newTotal = num - amount;
    // obtengo NaN
    console.log('new resultado egresos: ' +  newTotal);
    setExpensesAmount(currencyFormat(newTotal));
  } 
};

React.useEffect(() => {
 if (localStorage.getItem("user") !== null) {
   user = localStorage.getItem("user");
   getOperations();
 }
}, []);

 return(
   <div>
    // etc..
   </div>

 );

};

export default Home;

1 respuesta 1

1

Tu problema seguro debe ser que estás intentando usar la función parseFloat() con precios en pesos que tienen el símbolo $.

La cuestión es que mientras tenga ese símbolo no lo va a poder convertir en float.

Por eso, te recomiendo que le saques ese símbolo $ mediante la función .split().

Al sacarle ese símbolo, recién ahí vas a poder transformarlos a float, hacer la resta y luego de eso volver a convertir los valores a precios otra vez.

Acá hay un ejemplo de cómo podrías hacerlo:

const currencyFormat = (num) => {
  return Intl.NumberFormat('es-AR',    {style:'currency',currency:'ARS'}).format(num);
}
    
console.log("Número en pesos: " + currencyFormat(188600))  
console.log("Número en pesos: " + currencyFormat(53900))

function priceToFloat(price) {
  
  let priceFloat = price.split('$')
  priceFloat =  priceFloat[1]
  priceFloat = parseFloat(priceFloat)


   console.log("Precio transformado a float: " + priceFloat)   
   console.log("Confirmando que el tipo de dato es: " + typeof(priceFloat))
   
   return priceFloat
}  

let price1 = priceToFloat(currencyFormat(188600)) 
let price2 = priceToFloat(currencyFormat(53900)) 

console.log("Resta de los dos floats y transformación a pesos: " + currencyFormat(price1 - price2) )

Ahí se ven los valores iniciales en pesos.

Luego esos valores los paso como argumentos a la función priceToFloat() que se encargará de quitarles el simbolo $ para luego poder hacer el parseFloat().

Esa función me devolverá los dos valores ya en floats los cuales puedo restar entre sí y volver a convertirlos en precios.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.