Question

我的状态为value: 10.00，一旦我通过某些操作更新它并将其添加到<Text>，“。00”部分将被删除。如果它是一个像10.50的值，它将显示为10.5

这是一个问题，因为我想显示货币值。如何处理？

Answer 1

找到答案。要使用十进制值获取值，请使用toFixed()方法。

示例：

var value = 10;
value = value.toFixed(2);
this.setState({subTotal: value});

输出为：10.00

Answer 2

这是您也可以尝试的另一种解决方案，我需要的是不允许输入超过2个十进制数字（在小数点后），并且也不应超过两个小数点或任何其他字符。

    ConTwoDecDigit=(digit)=>{
      return digit.indexOf(".")>0?
              digit.split(".").length>=2?
               digit.split(".")[0]+"."+digit.split(".")[1].substring(-1,2)
              : digit
             : digit
    }
    <TextInput 
       value={this.state.salary}
       onChangeText={value => this.setState({ salary: this.ConTwoDecDigit(value) })} 
      keyboardType={'decimal-pad'}
    />

Answer 3

经过验证的答案的替代方案，可捕获更多边缘情况并允许输入字符串。（默认为 2dp，但可以由函数调用者设置）

export function normaliseValue (value: string, decimals = 2) {
  if (!value) {
    return ''
  }
  if (value === '.') {
    return value = '0.'
  }

  var regex = new RegExp(`^-?\\d+(?:\\.\\d{0,${decimals}})?`)
  const decimalsNumber = value.toString().match(regex)[0]
  const parsed = parseFloat(decimalsNumber).toFixed(2)
  if (isNaN(parsed)) {
    return '0'
  }
  return parsed
}

在代码中使用示例：

  <TextInput
    label='Hours worked'
    placeholder='Hours worked'
    keyboardType='decimal-pad'
    value={String(values.hours)}
    onChangeText={(val) => setFieldValue('hours', normaliseValue(val, 3))}
  />

在React Native中使用小数

3 个答案: