不清楚为什么, 当使用 flutter_hooks: ^0.18.2+1
时
class App extends HookWidget {
const LoginPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final TextEditingController _phone = TextEditingController();
final ValueNotifier<bool> _phoneCorrect = useState(false);
// 判断手机号是否满足 +86
_phone.addListener(() {
RegExp exp = RegExp(
r'^((13[0-9])|(14[0-9])|(15[0-9])|(16[0-9])|(17[0-9])|(18[0-9])|(19[0-9]))\d{8}$',
);
_phoneCorrect.value = exp.hasMatch(_phone.text);
});
Widget _userCard()
{
return Column(
children: [
Row(
children: [
const Text('+86'),
const SizedBox(width: 5),
Text(
'|',
style: TextStyle(
color: Colors.grey.shade600,
),
),
const SizedBox(width: 5),
Expanded(
child: TextField(
controller: _phone,
decoration: const InputDecoration(
hintText: '请输入手机号',
border: InputBorder.none,
),
),
),
],
),
ElevatedButton(
onPressed: _phoneCorrect.value ? submit : null,
child: const Text('发送验证码'),
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(
Colors.blue.shade400,
),
shape: MaterialStateProperty.all(
const StadiumBorder(),
),
minimumSize: MaterialStateProperty.all(
const Size(
double.infinity,
40,
),
),
)
]
);
}
return Scaffold(
body: _userCard(),
)
}
}
最小化还原了一下, 大致就是 默认下 发送验证码按钮是disable的, 当用户输入手机号后, 满足正则规则, 将 _phoneCorrect
设置为 true 允许发送验证码. 但是 实际下 手机号输入 满足后, 输入框内手机号 会 ( 消失? )
我觉得 可能是我对hook的使用存在问题, 求指点