Question

这是我的代码，我创建了一个ExpansionTile，它有一个孩子TextFormField。

import 'package:flutter/material.dart';

class OrderCreatePage extends StatefulWidget {
  @override
  _OrderCreatePageState createState() => _OrderCreatePageState();
}

class _OrderCreatePageState extends State<OrderCreatePage> {
  String _userID;
  TextEditingController _controllerl;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: new Text("Create"),
      ),
      body: ExpansionTile(
        title: Text("Create"),
        children: <Widget>[
          TextFormField(
            decoration: InputDecoration(
              labelText: "User ID",
              icon: Icon(Icons.face),
            ),
            validator: (val) {},
            controller: _controllerl,
            onSaved: (val) => _userID = val,
          )
        ],
      ),
    );
  }
}

每当我在TextFormField中输入内容并折叠ExpansionTile时，TextFormField中的数据都会丢失。我使用这种类型的UI，因为我必须创建一个获取大量详细信息的大型表单。如果没有ExpansionTile，则用户必须滚动很长一段距离。

Answer 1

https://api.flutter.dev/flutter/material/ExpansionTile/maintainState.html

ExpansionTile(maintainState: true, title: Text("text here"), ...

有了这个，孩子们在折叠和打开后的状态将保持不变。

Answer 2

如-@pskink

所述

在您的代码中TextEditingController _controllerl;下添加：

@override
  void initState() {
     super.initState();
    _controllerl = TextEditingController();
  }

因此您的代码如下：

class _OrderCreatePageState extends State<OrderCreatePage> {
  String _userID;
  TextEditingController _controllerl;
  @override
      void initState() {
         super.initState();
        _controllerl = TextEditingController();
      }
  @override
  Widget build(BuildContext context) {
       return Scaffold(
       ....
       ......

Answer 3

我假设您使用某种ScrollView来显示输入字段。

ExpansionTile reference中说明以下内容：

此小部件通常与ListView一起使用，以创建“展开/ 折叠”列表条目。当与ListView等滚动小部件一起使用时，必须指定唯一的 PageStorageKey 以启用ExpansionTile 滚动进出时保存和恢复其展开状态的观点。

因此添加PageStorageKey应该可以解决问题：

ExpansionTile(
        key: PageStorageKey('myInputField'),
        title: Text("Create"),
        children: <Widget>[
          TextFormField(
            decoration: InputDecoration(
              labelText: "User ID",
              icon: Icon(Icons.face),
            ),
            validator: (val) {},
            controller: _controllerl,
            onSaved: (val) => _userID = val,
          )
        ],
      )

当ExpansionTile在Flutter中崩溃时，ExpansionTile中的TextFormField会丢失数据

3 个答案: