flutter textformfield onsave（）被带有空值

Question

我想做一个自定义的TextFormField，因此我在需要时称其为“ doweruedata” onsave（）内部的属性在将数据传递给该数据后一直处于空置状态。 这是自定义TextFormField：

class CustomTextField extends StatelessWidget {
  CustomTextField({
    Key? key,
    required this.labelText,
    required this.textInputType,
    required this.message,
    required this.valuedata,
  }) : super(key: key);

  final String labelText;
  final TextInputType textInputType;
  final String message;
  String valuedata;
  @override
  Widget build(BuildContext context) {
    return TextFormField(
      onSaved: (value) {
        valuedata = value!;
      },
      keyboardType: textInputType,
      decoration: InputDecoration(
          labelStyle: const TextStyle(
            color: Colors.green,
          ),
          labelText: labelText,
          border: OutlineInputBorder(borderRadius: BorderRadius.circular(8.0)),
          focusedBorder: OutlineInputBorder(
            borderSide: const BorderSide(color: Colors.green, width: 2.0),
            borderRadius: BorderRadius.circular(8.0),
          )),
      validator: (text) {
        if (text!.isEmpty) {
          return message;
        } else {
          return null;
        }
      },
    );
  }
}

我在这里使用它：

 CustomTextField(
                      valuedata: input.input1,
                      labelText: 'name',
                      message: 'Please enter your name',
                      textInputType: TextInputType.text,
                    ),

这是我使用CustomTextField的完整代码：

class Apply extends StatefulWidget {
  const Apply({Key? key}) : super(key: key);

  @override
  _ApplyState createState() => _ApplyState();
}

class Data {
  String input1 = '';
  String input2 = '';
}

class _ApplyState extends State<Apply> {
  var formKey = GlobalKey<FormState>();
  static Data input = Data();
  var input1 = '';
  var input2 = '';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Theme(
          data: ThemeData(primaryColor: Colors.green),
          child: Form(
            key: formKey,
            child: SingleChildScrollView(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text(
                      "Les informations Personneles:",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    const SizedBox(
                      height: 8,
                    ),
                    CustomTextField(
                      valuedata: input.input1,
                      //data: data,
                      labelText: 'Prenom',
                      message: 'Please enter your name',
                      textInputType: TextInputType.text,
                    ),
                    const SizedBox(
                      height: 16,
                    ),
                    CustomTextField(
                      valuedata: input.input2,
                      labelText: 'Prenom',
                      message: 'Please enter your name',
                      textInputType: TextInputType.text,

                      //d,
                    ),
                    Row(
                      children: [
                        Expanded(
                            child: ElevatedButton(
                                style: ElevatedButton.styleFrom(
                                  primary: Colors.red,
                                ),
                                onPressed: () {
                                  formKey.currentState!.reset();
                                  input1 = '';
                                  input2 = '';
                                  setState(() {});
                                },
                                child: const Text('Clear'))),
                        const SizedBox(
                          width: 16,
                        ),
                        Expanded(
                            child: ElevatedButton(
                                style: ElevatedButton.styleFrom(
                                  primary: Colors.green,
                                ),
                                onPressed: () {
                                  if (formKey.currentState!.validate()) {
                                    formKey.currentState!.save();

                                    setState(() {});
                                  }
                                },
                                child: const Text('show'))),
                      ],
                    ),
                    const SizedBox(
                      height: 16,
                    ),
                    Text('Input1: ${input.input1}'),
                    Text('Input2: ${input.input1}'),
                    const SizedBox(
                      height: 16,
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

如果您参考Image Input1和Input2，则无法获得用户输入。 我的问题是，采用这种方法，如何使onsave（）在状态上保存值？

Answer 1

这就是您要寻找的

class Apply extends StatefulWidget {
const Apply({Key? key}) : super(key: key);

  @override
  _ApplyState createState() => _ApplyState();
}

class Data {
  List<String> inputs = ['',''];
}

class _ApplyState extends State<Apply> {
  var formKey = GlobalKey<FormState>();
  static Data input = Data();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Theme(
          data: ThemeData(primaryColor: Colors.green),
          child: Form(
            key: formKey,
            child: SingleChildScrollView(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text(
                      "Les informations Personneles:",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    const SizedBox(
                      height: 8,
                    ),
                    createTextField('label1', TextInputType.datetime, 'msg', 0),
                    createTextField('label2', TextInputType.datetime, 'msg', 1),
                    Row(
                      children: [
                        Expanded(
                            child: ElevatedButton(
                                style: ElevatedButton.styleFrom(
                                  primary: Colors.red,
                                ),
                                onPressed: () {
                                  formKey.currentState!.reset();
                                  //input1 = '';
                                  //input2 = '';
                                  setState(() {});
                                },
                                child: const Text('Clear'))),
                        const SizedBox(
                          width: 16,
                        ),
                        Expanded(
                            child: ElevatedButton(
                                style: ElevatedButton.styleFrom(
                                  primary: Colors.green,
                                ),
                                onPressed: () {
                                  if (formKey.currentState!.validate()) {
                                    formKey.currentState!.save();

                                    setState(() {});
                                  }
                                },
                                child: const Text('show'))),
                      ],
                    ),
                    const SizedBox(
                      height: 16,
                    ),
                    Text('Input1: ${input.inputs[0]}'),
                    Text('Input2: ${input.inputs[1]}'),
                    const SizedBox(
                      height: 16,
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
  createTextField(String labelText, TextInputType textInputType, String message, int index) => TextFormField(
      onSaved: (value) {
        setState(() {
          input.inputs[index] = value!;
        });
      },
      keyboardType: textInputType,
      decoration: InputDecoration(
          labelStyle: const TextStyle(
            color: Colors.green,
          ),
          labelText: labelText,
          border: OutlineInputBorder(borderRadius: BorderRadius.circular(8.0)),
          focusedBorder: OutlineInputBorder(
            borderSide: const BorderSide(color: Colors.green, width: 2.0),
            borderRadius: BorderRadius.circular(8.0),
          )),
      validator: (text) {
        if (text!.isEmpty) {
          return message;
        } else {
          return null;
        }
      },
    );
}