在 React Native 中将原始值传递给 onChangeText答案

【问题标题】：Pass raw value to onChangeText in React Native在 React Native 中将原始值传递给 onChangeText
【发布时间】：2020-06-07 20:47:40
【问题描述】：

在我的反应项目中，我正在使用 Formik 库。对于输入，我正在使用 TextInputMask 这是其他库。

export default function Calc() {
return (
    <Formik
        initialValues={{ monthly_rental: '', }}
    >
        {(props) => (
            <View>
                <Text>Monthly rental</Text>
                <TextInputMask
                    type={"money"}
                    options={{
                        precision: 0,
                        separator: ".",
                        delimiter: ",",
                        unit: "£",
                        suffixUnit: ""
                    }}
                    placeholder={"£500"}
                    value={props.values.monthly_rental}
                    includeRawValueInChangeText={true}
                    onChangeText={props.handleChange('monthly_rental')}
                />
            </View>
        )}
    </Formik>
  )
 }

上面的代码运行良好，但我想要的是在onChangeText={props.handleChange('monthly_rental')} 上设置原始值而不是格式化值。

我已经看到了这段代码，但我现在不去实现它

onChangeText={(text, rawValue) => {
        this.setState({
          value: text,
          raw: rawValue
        })

【问题讨论】：

标签： react-native formik textinput

【解决方案1】：

所以我终于知道了。在 Formik 库中有一个名为 setFieldValue: (field: string, value: any, shouldValidate?: boolean) => void 的函数。 see here

所以我的最终解决方案是这样的：

<TextInputMask
  type={"money"}
  options={{
    precision: 0,
    separator: ".",
    delimiter: ",",
    unit: "£",
    suffixUnit: ""
  }}
  style={globalstyles.input}
  textAlign={"center"}
  placeholder={"£500"}
  keyboardType={"decimal-pad"}
  value={props.values.monthly_rental}
  includeRawValueInChangeText={true}
  onChangeText={(maskedText, rawText) => {
    // Set RawText
    props.setFieldValue('monthly_rental', rawText)
  }}
/>

【讨论】：