按回车键时Flutter Web提交表单

v9tzhpje 于 2023-01-18 发布在 Flutter

关注(0)|答案(3)|浏览(210)

当用户在填写表单时点击enter按钮时，有没有一种方法可以调用submit按钮。下面是我的表单代码：

@override
  Widget build(BuildContext context) {
    String _email;
    return AlertDialog(
      title: Text('Password Reset'),
      content: Form(
        key: _formKey,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            TextFormField(
              decoration: InputDecoration(
                hintText: 'Email',
                labelText: 'Email',
              ),
              autofocus: true,
              maxLength: 30,
              validator: (value) {
                if (value.isEmpty) {
                  return 'Email is required';
                }
                return null;
              },
              onSaved: (input) => _email = input,
            ),
          ],
        ),
      ),
      actions: [
        RaisedButton(
          onPressed: () async {
            if (_formKey.currentState.validate()) {
              _formKey.currentState.save();
              var result = await auth.sendPasswordResetEmail(_email);
              print(result);
              Navigator.of(context).pop();
            }
          },
          child: Text('Reset'),
        )
      ],
    );
  }

flutter

来源：https://stackoverflow.com/questions/62418272/flutter-web-submit-form-on-enter-key

3条答案

按热度按时间

w1jd8yoj1#

对于一个TextFormField，处理这个的属性应该是onFieldSubmitted。你可以把代码从你的onPressed或者RaiseButton复制到这个。

onFieldSubmitted: (value) {
                if (_formKey.currentState.validate()) {
                  _formKey.currentState.save();
//               var result = await auth.sendPasswordResetEmail(_email);
//               print(result);
                  print(_email);
                  Navigator.of(context).pop();
                }
              },

完整的示例以codepen here的形式提供。
你可能也对RawKeyboardListener感兴趣，但是它不能识别enter键，但是可以监听其他键，如Shift，CapsLock等。

赞(0）回复(0）举报 2023-01-18

yeotifhr2#

根据需要使用TextFormField构造函数的onEditingComplete或onSubmitted参数。

赞(0）回复(0）举报 2023-01-18

bgibtngc3#

检查文本表单字段是否将textInputAction设置为TextInputAction.done或TextInputAction.go

赞(0）回复(0）举报 2023-01-18