Empty input type=number results in NaN

[vuhrmeister]

I'm using Formik with Yup Schema validation.

I have an input field of type "number". If I enter a value and empty the field this results in a NaN. This behavior might be as expected. For that I added a transform function to my schema like that:

yup
.number()
.transform(value => {
  console.log(value, Number.isNaN(value) ? 0 : value 
  return Number.isNaN(value) ? 0 : value
})

Should it respect the transform function? Or is the schema actually only be used for validation, not for "cleaning" the data? If so, is there a way how to solve that? Maybe I'm missing something.
Of course, I can check the value before attaching it to the input field. But the value in the global values object stays the same.

[sepehr500]

From what I understand, yup can only used for validation. Any kind of cleaning you try to do in yup will not effect the values object that formik manages internally.

[markuspelnens]

Hi @vuhrmeister, did you manage to solve it? I'm running into the same problem. Until I find a permanent solution, I ended up implementing this workaround:

value={values.quantity ? values.quantity : "" }

[vuhrmeister]

@markuspelnens nope, used the same workaround (but checking for Number.isNaN()).

[timc13]

is there any reason for this? It seems like we should be able to use replace the form values with the values returned by Yup validate(). If we're allowing integration with Yup, why not integrate all the way? Yup transforming is very powerful and it would be great if it "just worked"

[EmirGluhbegovic]

I am having the same issue, has this been fixed or is there some recommended way of dealing with this?

[nucab]

try to use setFieldValue

onChange={e => setFieldValue('condition.operand', +e.target.value)}