Flutter：SimpleDialog内的GridView搜索后无法实时更新问题求助

我明白你遇到的问题了——在SimpleDialog里的GridView没法实时响应搜索输入，只有滚动时才更新。这其实是因为Dialog的状态管理和父Widget的状态是分开的，父Widget的setState没法刷新已经弹出的Dialog内容。让我给你改改代码解决这个问题：

解决方案：把Dialog内容封装为独立的StatefulWidget #

我们需要让Dialog自己管理搜索状态，这样内部的setState才能直接触发GridView的实时更新：

// 新建一个独立的StatefulWidget作为Dialog内容
class ParentCategoryDialog extends StatefulWidget {
  final List<Map<String, dynamic>> myProducts;

  const ParentCategoryDialog({Key? key, required this.myProducts}) : super(key: key);

  @override
  State<ParentCategoryDialog> createState() => _ParentCategoryDialogState();
}

class _ParentCategoryDialogState extends State<ParentCategoryDialog> {
  late List<Map<String, dynamic>> finalList;

  @override
  void initState() {
    super.initState();
    finalList = List.from(widget.myProducts); // 初始化列表为完整数据
  }

  @override
  Widget build(BuildContext context) {
    return SimpleDialog(
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 10.0),
          child: TextField(
            onChanged: (value) {
              // 在setState内部直接更新过滤后的列表
              setState(() {
                finalList = widget.myProducts
                    .where((product) => product["name"]
                        .toString()
                        .toLowerCase()
                        .contains(value.toLowerCase()))
                    .toList();
              });
            },
            decoration: const InputDecoration(suffixIcon: Icon(Icons.close)),
          ),
        ),
        const SizedBox(height: 20),
        SizedBox(
          height: MediaQuery.of(context).size.height * 0.7,
          width: MediaQuery.of(context).size.width,
          child: Container(
            color: Colors.white,
            child: GridView.builder(
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
                crossAxisSpacing: 5.0,
                mainAxisSpacing: 5.0,
              ),
              itemCount: finalList.length,
              itemBuilder: (BuildContext context, index) {
                return Column(
                  children: [
                    const CircleAvatar(
                      backgroundColor: Colors.red,
                      radius: 20.0,
                    ),
                    Text(finalList[index]["name"])
                  ],
                );
              },
            ),
          ),
        )
      ],
    );
  }
}

然后修改原来的调用方法，改为弹出这个封装好的Dialog：

void _showParentCategory() {
  showDialog(
    context: context,
    builder: (context) => ParentCategoryDialog(myProducts: myProducts),
  );
}

问题原因说明 #

1. Dialog是独立路由：原来的代码中，你在父Widget的方法里直接构建SimpleDialog，而Dialog本质是一个独立的路由页面，父Widget的setState只能刷新父Widget本身，无法触及已经弹出的Dialog内容。
2. 无效的setState写法：你之前的setState(() { finalList; });是无效的，setState的回调里需要实际修改状态变量，或者把变量赋值操作放在setState内部，这样Flutter才能检测到状态变化并触发重绘。

内容的提问来源于stack exchange，提问作者Lalit Chattar