Question

我的问题有点类似于this这样的问题，但是我无法获得该值（仅数字）。

我有以下formikField

<Field
  name={`phoneNumber.value`}
  label="Phone Number"
  render={({ field }: any) => (
    <InputMask
      {...field}
      mask="(999) 999-9999"
      placeholder="Enter your phone number"
      type="text"
      onChange={(e: any) => {
        const val = e.target.value.match(/(\d+)/);
        console.log(val);
        formikProps.setFieldValue(
          `phoneNumber.value`,
          e.target.value,
        );
      }}
    />
  )}
  component={TextField}
/>

我的值像下面的"value":"(213) 456-7883"一样出现，但是我只想要数字（1234567883）。我浏览了与formik相关的多个线程，但未能到达任何地方。

有其他方法吗？

Answer 1

您正在将formik字段值设置为输入掩码的结果，该输入掩码仍包含格式化的文本。如果只需要数字，则可以在设置字段值之前使用正则表达式删除所有非数字值。

onChange={(e) => {
  formikProps.setFieldValue(
    'phoneNumber.value',
     e.target.value.replace(/\D/g, '') // removes all non-numeric characters
  );
}}

此外，您尝试使用正则表达式匹配数字，但仅使用e.target.value而不是使用正则表达式，然后将结果传递给setFieldValue

在Formik中使用React输入蒙版（InputMask）

1 个答案: