用控制器初始化它们的值。有些字段是纯文本字段,但有些字段有掩码,如电话和邮政编码字段。
一旦我把字段放在焦点上,并开始退格键来擦除最后的字符,它在没有掩码的字段上工作得很好。有掩码的字段将清除字段的全部内容。
我使用的是Flutter 3和mask_text_input_formatter ^2.4.0。
下面是我的代码,它重现了两个字段的问题。如果你运行这段代码,并把焦点放在name字段上,你可以退格它,只有最后的字符会被清除。但在phone字段中,这会导致整个字段被清除。
import 'package:flutter/material.dart';
import 'package:mask_text_input_formatter/mask_text_input_formatter.dart';
final phoneMaskFormatter = MaskTextInputFormatter(mask: '(###) ### ####');
class Test extends StatefulWidget {
const Test({Key? key}) : super(key: key);
@override
State<Test> createState() => _TestState();
}
class _TestState extends State<Test> {
final _formKey = GlobalKey<FormState>();
late TextEditingController _nameController;
late TextEditingController _phoneController;
var myData = {'name': 'William', 'phone': '(305) 786 1234'};
@override
void initState() {
super.initState();
_nameController = TextEditingController();
_phoneController = TextEditingController();
_nameController.text = myData['name']!;
_phoneController.text = myData['phone']!;
}
@override
void dispose() {
super.dispose();
_nameController.dispose();
_phoneController.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Form(
key: _formKey,
child: Container(
padding: EdgeInsets.all(50),
child: Column(
children: [
Text('Name: ${myData['name']}'),
Text('Phone: ${myData['phone']}'),
SizedBox(height: 100),
TextFormField(
controller: _nameController,
onChanged: (value) {
// do my stuff
setState(() {
myData['name'] = value;
});
}),
TextFormField(
controller: _phoneController,
inputFormatters: [phoneMaskFormatter],
onChanged: (value) {
// do my stuff
setState(() {
myData['phone'] = value;
});
}),
],
),
),
),
),
);
}
}
现在唯一对我起作用的就是在电话领域摘下面具。
1条答案
按热度按时间kdfy810k1#
使用extended_masked_text: ^2.3.1它满足您的要求。
声明_phoneController,然后初始化与您所做的相同。
并除去
inputFormatters: [numberController]
。