modalBottomSheet 内的 Flutter ExpansionPanelList 不更新状态

Question

我有一个模态底页，我想在其中放置扩展列表。为此，我创建了一个类来为我的 ExpansionPanelList 创建项目。

class FilterItem {
  bool isExpanded;
  final String header;
  final Widget body;
  FilterItem(this.isExpanded, this.header, this.body);
}

我只是为每个项目提供 isExpanded bool 值来判断它最初是否展开，ExpansionPanel 的标题(按预期工作)和扩展面板。

我有一个这样的项目列表:

items = <FilterItem>[
    new FilterItem(
        false,
        'Bit Size',
        GridView.builder(
        shrinkWrap: true,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
        itemCount: _docs["Bit Size"].length,
        itemBuilder: (context,index) {
            return Text(_docs["Bit Size"].elementAt(index),style:TextStyle(color:Colors.black));
        },
        )
    ),
];

我现在正在测试一个项目，它的主体是一个 GridView，我没有机会测试它是否正确显示，因为 ExpansionPanel 不起作用。

项目的这个 List 与 showModalBottomSheet() 方法 中的 ExpansionPanelList 一起使用，我使用按钮调用该方法。这是方法的主体:

showModalBottomSheet(
    context: context,
    builder: (context) {
    return ListView.builder(
        shrinkWrap: true,
        itemCount: (items.length == null) ? 0:items.length,
        itemBuilder: (context,index) {
        return ExpansionPanelList(
            expansionCallback: (int index, bool isExpanded) {
            setState(() {
                items[index].isExpanded = !items[index].isExpanded;
            });
            },
            children: items.map((FilterItem item) {
            print("b");
            return ExpansionPanel(
                headerBuilder: (BuildContext context, bool isExpanded) {
                return ListTile(
                    title: new Text(
                        item.header,
                        textAlign: TextAlign.left,
                        style: new TextStyle(
                        fontSize: 20.0,
                        fontWeight: FontWeight.w400,
                        ),
                    ));
                },
                isExpanded: item.isExpanded,
                body: item.body,
            );
            }).toList(),
        );
        },
    );
    },
    isScrollControlled: true,
);

如您所见，我已将 ExpansionPanel 的 isExpanded 属性设置为列表中项目的值，并在 ExpansionPanelList 回调，我在 setState 中更新它。

这就是问题所在，展开不起作用。我在这里做错了什么？

Answer 1

要更新 Bottom Sheet 中的状态，您需要像 StatefulBuilder 一样包装返回的小部件

showModalBottomSheet(
    context: context,
    builder: (BuildContext context) {
      return StatefulBuilder(
        builder: (BuildContext context,StateSetter  setStateOfBottomSheet) {
          return Column(
            children: <Widget>[
              FlatButton(
                  onPressed: () {
               setStateOfBottomSheet;
                  },
                  child: Text('Hello'))
            ],
          );
        },
      );
    });

然后你可以调用我在之前代码中命名的这个对象:setStateOfBottomSheet 当您调用它时，您可以更新底部工作表的状态