javascript - How do i update text input value to use currency format - Stack Overflow

admin管理员组

文章数量:1414870

This is my code :

onChangeTextPrice(value) {
  const newPrice = parseInt(value, 10).toLocaleString(['ban', 'id']);
  return this.setState({ price: formatted });
}

If I console.log(newPrice), it will give me the format, for example : 10.000.000

but for some reason react native textinput doesn't use this value instead it show 10000000.

but if I change TextInput value like this:

<TextInput
   keyboardType="numeric"
   value={'10.000.000'}
   multiline={false}
   underlineColorAndroid="transparent"
   onChange={val => this.onChangeTextPrice(val)}

It works. Why is that ?

This is my code :

onChangeTextPrice(value) {
  const newPrice = parseInt(value, 10).toLocaleString(['ban', 'id']);
  return this.setState({ price: formatted });
}

If I console.log(newPrice), it will give me the format, for example : 10.000.000

but for some reason react native textinput doesn't use this value instead it show 10000000.

but if I change TextInput value like this:

<TextInput
   keyboardType="numeric"
   value={'10.000.000'}
   multiline={false}
   underlineColorAndroid="transparent"
   onChange={val => this.onChangeTextPrice(val)}

It works. Why is that ?

• javascript
• react-native
• currency-formatting

Share Improve this question Follow edited Jul 10, 2018 at 6:16 Ankit Agarwal 30.8k55 gold badges4040 silver badges6363 bronze badges asked Jul 10, 2018 at 6:10 william anputrawilliam anputra 16911 gold badge55 silver badges1212 bronze badges 8

• I have never used react but reading this document seems giving the answer as this is masking and masking needs to be declared before initialization. github./benhurott/react-native-masked-text – Ullas Hunka Commented Jul 10, 2018 at 6:25
• I guess keyboadType="numeric" will result in an input type="number" which does only alow numbers without formating – Lars-Olof Kreim Commented Jul 10, 2018 at 6:41
• Can you try this ponent npmjs./package/react-currency-input – Pramod Commented Jul 10, 2018 at 6:52
• I use github./react-native-munity/react-native-text-input-mask for the input masking. – Shivam Commented Jul 10, 2018 at 9:35
• @Pramod it didn't work – william anputra Commented Jul 10, 2018 at 9:41

 |  Show 3 more ments

1 Answer 1

Sorted by: Reset to default 2

You might wanna use one of the following packages in order to achieve simple/plex input maskings.

github./benhurott/react-native-masked-text

github./react-native-munity/react-native-text-input-mask

A nice tutorial can be found here

本文标签： javascriptHow do i update text input value to use currency formatStack Overflow