react-native - TextInput 从右到左输入数字并自动添加零以进行货币输入

Question

我正在尝试TextInput通过从右到左输入数字并在用户输入时自动添加零来实现。任何想法如何正确实施？

预期的行为应该是这样的。

我现在拥有的：

 constructor(props) {
    super(props);
    this.state = {
      payrate: '',
    };
  }

  handleTextChange = (text) => {
    const newAmount = parseFloat(text/100);
     this.setState({
       payrate: newAmount,
     })


 <TextInput
         autoFocus
         style={[styles.textInput]}
         value={payrate}
         placeholder="0.00"
         maxLength={9}
         keyboardType="numeric"
         placeholderTextColor="#adecf5"
         onChangeText={this.handleTextChange}
         underlineColorAndroid='rgba(0,0,0,0)'
         autoCapitalize="none"
         selection={{start: cursor, end: cursor}}
         />

标签： react-nativereact-native-androidtextinput

Answer 1

我们为此使用 react-native-masked-text，效果很好。https://github.com/benhurott/react-native-masked-text/blob/master/README.md