我想用 Provider 动态添加小部件

Question

我正在使用 Provider package，我想动态添加要显示的小部件。 我编写了如下代码，但小部件没有显示任何内容。 没有发生错误。

// Contains widget and related data
class WidgetData {
    Widget? child;  // want to show this
    String data1;
    int data2;
}    

class Model exteds ChangeNotifier {
    List<WidgetData> widget;   // I want to show all of this widget.child
    
    void addWidget(Widget child) {
        print("Called1") // "Called1"
        var w = widgets.toList();
        w.add(child);
        widgetData = w;
        notifyListeners();
    }
}

class Example extends StatelessWidget {
    @override
    build (BuildContext context) {
        return Scaffold(
            body: Column(children: [
                 for(var i in context.watch<Model>().widget) i.child!;
        ]);
    }
}

当按下按钮时， context.read<Model>().addWidget(Text("test"))将被调用。 但仍然不显示小部件。

 // inside of build(BuildContext context)
 FloatingActionButton(
   onPressed: () => context.read<Model>().addWidget(Text("test")),
   child: Icon(Icons.abc)
 ); 

当然，我在main中构建了提供者树。

void main() {
  runApp(MultiProvider(
     ChangeNotifierProvider<Model>(
       create: (_) => Model()),
  ));

  child: 
  ....
}

Answer 1

不鼓励在 Flutter 中的构建 function 之外创建和存储小部件。 您的提供者不应该提供小部件，而是提供构建小部件所需的数据，然后您在build方法中构建小部件。

例如，如果你有一个字符串列表而不是小部件列表，那么在build方法中，你可以轻松地将该字符串列表转换为Text小部件，如下所示： Column(children: stringlist.map((e) => Text(e)).toList())