如何在 SearchDelegate 中使用 setState答案

【问题标题】：how to use setState in SearchDelegate如何在 SearchDelegate 中使用 setState
【发布时间】：2019-10-12 18:09:12
【问题描述】：

我想通过添加带有一些单选按钮和其他小部件的表单来在搜索结果中添加更多过滤器。该文档指出Radio 不保持状态，应调用父级的setState onChange 方法来重建小部件。调用showModalBottomSheet 后将显示该表单。查看search.dart 看起来 setState 仅在查询更改时在内部调用

我做了什么 假设没有这样的方法，setState，我重新显示对话，调用Navigation.pop(context)，然后调用showModalBottomSheet。单选按钮现在可以更新 onChanged 的值，但重新显示对话的过渡看起来很难看（每次值更改时都会滑动动画）。

是否可以在 searchDelegate 中使用 setState 以及如何使用？

【问题讨论】：

我将 ListView 包裹在 Scaffold 中，并在 buildResults 上使用 FAB。在 FAB 上单击 i showModalBottomSheet，其中包含单选按钮。问题是，我无法立即看到所选单选按钮的变化。谢谢
我在 searchDelegate 中寻找 setState，才发现与它无关。只需将我与 StatefulBuilder 的对话结束即可，我很抱歉造成混乱

标签： flutter

【解决方案1】：

@George 已经提供了解决方案，但这里有一个使用 SearchDelegate 时的完整示例：

class DataSearch extends SearchDelegate<String> {
    bool _isItemSelected = true;

    //...rest of the @override methods

    @override
    Widget buildSuggestions(BuildContext context) {
        return StatefulBuilder(
            builder: (BuildContext context, StateSetter setState) {
                return CheckboxListTile(
                    title: const Text('Item'),
                    value: _isItemSelected,
                    onChanged: (bool newValue) {
                        setState(() {
                            _isItemSelected = newValue;
                        });
                    },
            );
    });
  }
}

【讨论】：

【解决方案2】：

你需要使用的是StatefulBuilder，由showModalBottomSheet的builder返回。

StatefulBuilder 提供setState 方法来重建自己的子树。

例如

int selected;

showModalBottomSheet(context: context, builder: (_) =>
  StatefulBuilder(builder: (modalContext, modalSetState) =>
    Column(children: <Widget>[

      Text("Select radio button"),
      RadioListTile(
        value: 1,
        groupValue: selected,
        onChanged: (val) => modalSetState(() => selected = val),
        title: Text("One")
      ),
      RadioListTile(
        value: 2,
        groupValue: selected,
        onChanged: (val) => modalSetState(() => selected = val),
        title: Text("Two")
      ),

    ])
  )
).whenComplete(() {
  print("Selected: $selected");
});

在我的示例中，setState 的模态内容被声明为 modalSetState 构建器参数。

【讨论】：

哇，我错过了这个StatefulBuilder 小部件，谢谢@George ！！