Question

我正在屏幕上编辑列表中的项目。用户点击该项目，然后我打开一个新页面，其中有一个DropdownButton，一个TextFormField和一个保存按钮。

如果您先更改DropdownButton值，然后点击以将焦点放在TextFormField上，则对DropdownButton值所做的所有更改都会被重置。导航到此页面时，该值将返回到初始状态，而不是用户选择的值。如何保留用户在此处选择的价值？

要打开编辑页面，我从正在编辑的列表项中传递参数：

final updated = await Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => EditPage(
                              display: commute.display,
                              origin: commute.origin)));

EditPage类本身：

class EditPage extends StatefulWidget {
  String display;
  String origin;

  EditPage({Key key, @required this.display, @required this.origin})
      : super(key: key);

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

class EditPageState extends State<EditPage> {
  final _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Edit"),
      ),
      body: Form(
        key: _formKey,
        child: Column(
          children: <Widget>[
            DropdownButton(
              value: widget.origin,
              onChanged: (value) {
                this.setState(() {
                  widget.origin = value;
                });
              },
            ),
            TextFormField(
              initialValue: widget.display,
              onSaved: (value) {
                setState(() {
                  widget.display = value;
                });
              },
            ),
            RaisedButton(
              child: Text('Save'),
              onPressed: () {
                final form = _formKey.currentState;
                if (form.validate()) {
                  form.save();
                  final thing =
                      Thing(display: widget.display, origin: widget.origin);
                  Navigator.pop(context, thing);
                }
              },
            ),
          ],
        ),
      ),
    );
  }
}

Answer 1

问题最终是Navigator。损坏的代码将推送EditPage的新副本，而不是固定版本。将代码更改为此就可以了：

final editor = EditPage(
                 display: commute.display,
                 origin: commute.origin);

final updated = await Navigator.push(context,
                      MaterialPageRoute(builder: (context) => editor));

TextFormField重设焦点状态

1 个答案: