How can I disable react-number-format input

2.5k Views Asked by At

I'd like to disable react-number-format input, but this component doesn't have disabled property. How can I disable it?

2

There are 2 best solutions below

0
Apostolos On BEST ANSWER

disabled is working fine.

I have placed 2 components, one without the disabled attribute and the other one with the disabled attribute and the result is the desired one.

  <NumberFormat
    value={111}
    thousandSeparator={true}
    prefix="$"
    className="some"
    inputmode="numeric"
  />
  <NumberFormat
    value={222}
    thousandSeparator={true}
    prefix="$"
    className="some"
    inputmode="numeric"
    disabled
  />

Check this sandbox

0
Sebastian R On

For anyone wondering you can also show the number just as text. You can use the displayType prop.

  <NumberFormat
    value={69}
    thousandSeparator={true}
    prefix="$"
displayType="text"
  />