为什么 StatefulWidget 在调用 setState 时不更新？

Question

我正在编写一个使用 floatingActionButton 的程序。 OriginFloatingActionButton()调用时，方法中调用showDialog()。

Profile 先打电话。

@immutable
class Profile extends StatefulWidget {
  const Profile({Key? key}) : super(key: key);

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

class _Profile extends State<Profile> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: OriginFloatingActionButton(),
      .......
    );
  }
}

下面的代码显示 floatingActionButton，并在按下时显示对话框。在此对话框中，当按下 ElevatedButton 时，添加带有 setState 的 strings 列表元素。但是 ListView.builder 中的元素数量没有更新。当我关闭对话框并重新打开它时，它更新了。如何在推送 ElevatedButton.

时更新 ListView.builder

class OriginFloatingActionButton extends StatefulWidget {
  const OriginFloatingActionButton({Key? key}) : super(key: key);

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

class _OriginFloatingActionButton extends State<OriginFloatingActionButton> {
  List<String> strings = <String>[
    "abc"
  ];
  @override
  Widget build(BuildContext context) {
    return Container(
        margin: const EdgeInsets.only(bottom: 30.0, right: 30),
        width: 140,
        height: 55,
        child: SingleChildScrollView(
          child: FloatingActionButton.extended(
            label: const Text("Post"),
            icon: const Icon(Icons.add),
            backgroundColor: Colors.blue,
            foregroundColor: Colors.white,
            onPressed: () {
              showDialog(
                  context: context,
                  builder: (BuildContext context) {
                    return Dialog(
                        elevation: 16,
                        child: Container(
                          height: 700,
                          width: 500,
                          child: Center(
                            child: Column(
                              children: <Widget>[
                                Center(
                                  child: Row(
                                    mainAxisSize: MainAxisSize.min,
                                    children: [
                                      SizedBox(
                                          width: 300,
                                          child: Expanded(
                                              child: ListView.builder(
                                                  shrinkWrap: true,
                                                  itemCount:
                                                      strings.length,
                                                  itemBuilder:
                                                      (BuildContext context,
                                                          int index) {
                                                    return TextField(
                                                      decoration: InputDecoration(
                                                          label: Text(
                                                              "Artist Name " +
                                                                  index
                                                                      .toString()),
                                                          border:
                                                              const OutlineInputBorder()),
                                                    );
                                                  }))),
                                      const SizedBox(
                                        width: 5,
                                      ),
                                      ElevatedButton(
                                        child: const Icon(Icons.add),
                                        style: ElevatedButton.styleFrom(
                                            primary: Colors.white,
                                            onPrimary: Colors.black,
                                            shape: const CircleBorder(
                                                side: BorderSide(
                                                    color: Colors.black,
                                                    width: 1,
                                                    style: BorderStyle.solid))),
                                        onPressed: () {
                                          setState(() {
                                            if (mounted) {
                                              strings
                                                  .add("ABC");
                                            }
                                          });
                                        },
                                      ),
                               ........

这是因为我在floatingActionButton:中调用了OriginFloatingActionButton()吗？到目前为止，没有发生任何错误。如何在不刷新对话框的情况下更新 ListView？

Answer 1

使用StatefulBuilder在Dialog中使用setState

showDialog(
  context: context,
  builder: (context) {
    return StatefulBuilder(
      builder: (context, setState) {
        return AlertDialog(
          title: Text("Title of Dialog"),
          content: Text(contentText),
          actions: <Widget>[
            TextButton(
              onPressed: () => Navigator.pop(context),
              child: Text("Cancel"),
            ),
            TextButton(
              onPressed: () {
                setState(() {
                  ///this will update 
                });
              },
              child: Text("Change"),
            ),
          ],
        );
      },
    );
  },
);

为什么 StatefulWidget 在调用 setState 时不更新？

Why StatefulWidget doesn't update when setState called?

dart

flutter

flutter-web