1

我有一个用于十进制数字输入的可重复使用的 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,
    );
  }
}
4

2 回答 2

1

如果您只想要结果(没有 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 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 的更多信息。

于 2022-01-08T16:40:47.107 回答
0

你应该更好地使用RegExTextFormField在您的 'sinputFormatters中添加一个禁止逗号的表达式。它不会取代它,但您将无法编写它。

于 2022-01-08T16:15:37.833 回答