본문 바로가기

Flutter-플러터/플러터 공부

flutter form 위젯을 사용할 때 하위에 있는 텍스트폼필드 위젯에 값을 저장하려고해 하지만 아무 값도 입력하지 않고 저장하면 오류가 생기네 ? 어떻게 해야 할까

반응형
class MyForm extends StatefulWidget {
  @override
  _MyFormState createState() => _MyFormState();
}

class _MyFormState extends State<MyForm> {
  final _formKey = GlobalKey<FormState>();
  String _text;

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      autovalidateMode: AutovalidateMode.onUserInteraction,
      child: Column(
        children: [
          TextFormField(
            validator: (value) {
              if (value.isEmpty) {
                return 'Please enter some text';
              }
              return null;
            },
            onSaved: (newValue) => _text = newValue,
          ),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState.validate()) {
                _formKey.currentState.save();
                // save the form data
              }
            },
            child: Text('Save'),
          ),
        ],
      ),
    );
  }
}

 

 

이 예에서 Form 위젯의 autovalidateMode 속성은 AutovalidateMode.onUserInteraction으로 설정되어 있습니다. 즉, 사용자가 양식과 상호작용할 때마다 양식이 자동으로 검증됩니다. TextFormField 위젯에는 값이 비어 있는지 확인하고 비어 있는 경우 오류 메시지를 반환하는 validator 속성이 있습니다. onSaved 속성은 양식 데이터를 _text 변수에 저장하는 데 사용됩니다. 마지막으로 ElevatedButton 위젯의 onPressed 속성은 _formKey.currentState.validate() 메소드를 사용하여 양식이 유효한지 확인하고 유효하면 _formKey.currentState.save()를 사용하여 양식 데이터를 저장합니다. 방법.

반응형