时间戳

首页 > 解决方案 > 在列表中添加或删除项目时，列表构建器重复数据的问题

flutter - 在列表中添加或删除项目时，列表构建器重复数据的问题

问题描述

我是新来的颤振。当我添加新项目或从列表中删除项目时，列表构建器会更新列表，但问题是列表构建器还显示以前的项目列表并显示新的更新项目列表。所以我想做的是保留新的更新项目列表而不是旧项目列表。

class AlarmPage extends StatefulWidget {
      final String title;
      AlarmPage({Key key, this.title}) : super(key: key);

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

    class _AlarmPageState extends State<AlarmPage> {
      String alarmName;
      // Test Function
      void _addAlarm() {
        setState(() {
          Navigator.push(
              context, MaterialPageRoute(builder: (context) => AddAlarm()));
        });
      }

      @override
      void initState() {
        super.initState();
        Provider.of<AlarmsProvider>(context, listen: false).getLocalStorage();
      }

      @override
      Widget build(BuildContext context) {
        List<Widget> allWidgetsAlarms = List<Widget>();

        return Consumer<AlarmsProvider>(builder: (context, alarmProviderItem, _) {
          List<String> localAlarms = alarmProviderItem.alarms;
          if (localAlarms != null) {
            localAlarms.forEach((item) {
              allWidgetsAlarms.add(
                Stack(
                  children: <Widget>[
                    InkWell(
                      child: Container(
                        color: Color(0xff212121),
                        padding: EdgeInsets.all(10),
                        child: Column(
                          children: <Widget>[
                            // Alarm Name & Title
                            Container(
                              decoration: BoxDecoration(
                                  border: Border(
                                bottom: BorderSide(width: 2),
                              )),
                              child: Row(
                                children: <Widget>[
                                  Icon(Icons.alarm, color: Colors.yellow),
                                  SizedBox(width: 20.0),
                                  Text('$item',
                                      style: TextStyle(
                                          color: Color(0xffC1C1C1),
                                          fontSize: 15.0,
                                          fontWeight: FontWeight.w900)),
                                  SizedBox(height: 5),
                                ],
                              ),
                            ),
                            SizedBox(height: 10),
                            // Alarm Time & Toggle Switch
                            Container(
                              child: Row(
                                children: <Widget>[
                                  Text(
                                    'Time',
                                    style: TextStyle(
                                        fontSize: 30, color: Colors.white),
                                  ),
                                  SizedBox(width: 20),
                                  Text(
                                    'AM / PM',
                                    style: TextStyle(
                                        fontSize: 20, color: Color(0xffB5B5B5)),
                                  ),
                                  SizedBox(width: 150),
                                  Icon(Icons.switch_camera, color: Colors.yellow),
                                ],
                              ),
                            ),
                            // Alarm Repeat
                            Container(
                              child: Row(children: <Widget>[
                                Text(
                                  'Repeat',
                                  style: TextStyle(
                                      fontSize: 11, color: Color(0xff616161)),
                                ),
                                Container(
                                  child: DaySelector(
                                    value: null,
                                    onChange: (value) {},
                                    color: Colors.yellow[400],
                                    mode: DaySelector.modeFull,
                                  ),
                                ),
                              ]),
                            ),
                          ],
                        ),
                      ),
                      onLongPress: () {
                        Navigator.push(
                            context,
                            MaterialPageRoute(
                                builder: (context) => AddAlarm(item: item)));
                      },
                    ),
                    SizedBox(height: 180),
                  ],
                ),
              );
              print(item);
            });
          }

          return Scaffold(
            appBar: AppBar(
              backgroundColor: Colors.black,
              title: Text('Azy Alarm'),
              centerTitle: true,
            ),
            body: Container(
              decoration: BoxDecoration(
                image: const DecorationImage(
                    fit: BoxFit.cover,
                    image: AssetImage('assets/images/background_image(dark).png')),
              ),
              // child: ListView(children: allWidgetsAlarms),

              child: ListView.builder(
                  itemCount: allWidgetsAlarms.length,
                  padding: const EdgeInsets.all(8.0),
                  itemBuilder: (BuildContext context, int index) {
                    return allWidgetsAlarms[index];
                  }),
            ),
            floatingActionButton: FloatingActionButton(
              child: Icon(Icons.add),
              backgroundColor: Colors.blue,
              elevation: 0,
              onPressed: _addAlarm,
            ),
          );
        });
      }
    }

标签： flutterflutter-layout

解决方案

所以我认为你的问题是这一行：allWidgetsAlarms.add(你allWidgetsAlarms在你的构建器中构建，但每次Consumer重建时都不会再次调用构建器，因此它只是将新内容附加到列表的末尾。要解决此问题，请将原始初始化保留allWidgetsAlarms在 Consumer 中构建器的顶部，添加以下行：

allWidgetsAlarms = List<Widget>();

这将重新设置allWidgetsAlarms。希望能帮助到你！

推荐阅读