Flutter中TextFieldForm代码赋值时输入掩码失效如何解决

使用mask_text_input_formatter: ^2.3.0时，直接通过controller.text = 原始文本的方式赋值，文本变更流程不会触发绑定在输入框上的MaskTextInputFormatter格式化拦截逻辑，原始纯手机号字符串不会被自动插入掩码分隔符，最终展示为无格式的原始内容。

• 方案1：复用掩码实例手动格式化文本后赋值
  将MaskTextInputFormatter实例作为State成员变量全局持有，不要在build方法内临时创建，手机号掩码初始化示例：

  // 定义在State类中，和绑定到输入框的是同一个实例
  final MaskTextInputFormatter phoneMask = MaskTextInputFormatter(
    mask: '### #### ####',
    filter: {"#": RegExp(r'[0-9]')},
  );
  final TextEditingController phoneController = TextEditingController();
  

  读取到本地存储的纯手机号字符串后，调用实例的maskText方法格式化后再赋值：

  // 从本地读取的原始11位手机号，无任何格式
  String rawPhone = await readLocalPhoneFile();
  // 用持有的掩码实例格式化文本
  String formattedPhone = phoneMask.maskText(rawPhone);
  phoneController.text = formattedPhone;
  

  注意：必须使用和输入框inputFormatters属性绑定的同一个掩码实例，新建实例会导致规则匹配失效。

• 方案2：构造TextEditingValue赋值触发自动格式化
  不需要手动调用格式化方法，直接更新controller的value属性，模拟真实输入的文本变更事件，输入框绑定的掩码格式化器会自动完成格式处理：

  String rawPhone = await readLocalPhoneFile();
  phoneController.value = TextEditingValue(
    text: rawPhone,
    selection: TextSelection.collapsed(offset: rawPhone.length),
  );
  

不要在build方法内临时创建MaskTextInputFormatter实例，否则不仅动态赋值会出现格式失效，手动输入时也容易出现光标错位、格式错乱的问题。
输入框配置参考，直接传入全局持有的掩码实例即可：

TextFormField(
  controller: phoneController,
  keyboardType: TextInputType.phone,
  inputFormatters: [phoneMask],
  decoration: const InputDecoration(labelText: "手机号"),
)

内容的提问来源于stack exchange，提问作者GDTyka