如何在 Flutter 中动态更新 ListView.builder()？

Question

我想动态呈现一个 ListView。如果列表中的值发生变化，我必须使用我的 IDE 手动热重新加载应用程序才能应用更改。我试过使用 StreamBuilder，但是语法太复杂了。

这是我的代码：

    ListView.builder(
          physics: NeverScrollableScrollPhysics(),
          itemCount: myMap.length,
          shrinkWrap: true,
          itemBuilder: (context, index) {
            return myMap.values.elementAt(index) == true
                ? Container(
                    padding: EdgeInsets.only(left: 20, right: 20, top: 20),
                    child: Container(child: Text(myMap.keys.elementAt(index)))
                : Container();
          }),

我的有状态小部件：

    import 'package:flutter/material.dart';

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

      @override
      _NextWidgetState createState() => _NextWidgetState();
    }
    
    class _NextWidgetState extends State<NextWidget> {
      @override
      Widget build(BuildContext context) {
        return Container(
           child: MaterialButton(onPressed: () {
             setState(() {
               myMap[1] = 'Modified Value';
             }
           }, child: Text('Modify')),
        );
      }
    }

Answer 1

您有两种可能的方法：

将函数从 parent widget 传递到 child widget。然后你可以用它直接改变父的state：

// in parent widget define a function
void parentSetState(){
   setState((){});
   //also you can add your own code too
}

// then in child widget use this function
MaterialButton(onPressed: () {
 setState(() {
  myMap[index] = index * 2;
  widget.parentSetState();
 }
}, child: Text('Modify')),

使用像 provider 这样的状态管理。就个人而言，我更喜欢使用这种方法。参见 this link

Answer 2

在调用 Next 小部件的地方，它用 inkwell 包装并在 inkwell 下编写 set stae 方法而不是下一个小部件

 InkWell(
            onTap: (){
              setState(() {
                /// write your code 
              });
            },
            child: NextWidget(),
          )

如何在 Flutter 中动态更新 ListView.builder()？

how to dynamically update ListView.builder() in Flutter?

listview

dynamic

flutter