Flutter：如何在调用 TextFormField 的 onChanged 方法之前调用函数？

Question

我有一个用于十进制数字输入的可重复使用的 TextFormField 小部件。如果用户输入一个带逗号而不是点的十进制数，我想替换它。因此，为此我创建了一个可重用的 TextFormField 小部件，我想在其中用点替换 onChanged 方法之前的逗号。但是如何在调用 onChanged 之前调用函数 replaceCommaWithDot() 呢？这是可重复使用的小部件：

class DecimalTextFormField extends StatelessWidget {
  const DecimalTextFormField({Key? key, this.onChanged})
      : super(key: key);
  final ValueChanged? onChanged;

  @override
  Widget build(BuildContext context) {

    replaceCommaWithDot(String inputNumber) {
      if (inputNumber.contains(',')) {
        String newText = inputNumber.replaceAll(',', '.');
        return newText;
      }
      return inputNumber;
    }

    return TextFormField(
      keyboardType: const TextInputType.numberWithOptions(decimal: true),
      // how to use replaceCommaWithDot method when onChanged gets called?
      onChanged: onChanged,
    );
  }
}

Answer 1

你最好使用RegEx。在 TextFormField 的 inputFormatters 中添加一个禁止逗号的表达式。它不会取代它，但您将无法编写它。

Answer 2

如果您只想要结果（没有 ui 更新），您的代码片段将工作正常。

  onChanged: (value) {
        final v = replaceCommaWithDot(value);
        if (onChanged != null) onChanged!(v);
      },

如果您还想更新UI，您可以使用inputFormatters


class CustomFormater extends TextInputFormatter {
  replaceCommaWithDot(String inputNumber) {
    if (inputNumber.contains(',')) {
      String newText = inputNumber.replaceAll(',', '.');
      return newText;
    }
    return inputNumber;
  }

  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue, TextEditingValue newValue) {
    return newValue.copyWith(text: replaceCommaWithDot(newValue.text));
  }
}

并且DecimalTextFormField将return

return TextFormField(
  keyboardType: const TextInputType.numberWithOptions(decimal: true),
  // how to use replaceCommaWithDot method when onChanged gets called?
  inputFormatters: [
    CustomFormater(),
  ],
  onChanged: (value) {
    if (onChanged != null) onChanged!(value);
  },
);

更多关于TextInputFormatter.

Flutter：如何在调用 TextFormField 的 onChanged 方法之前调用函数？

Flutter: How to call a function before onChanged Method from TextFormField gets called?

textfield

dart

flutter

statelesswidget

textformfield