flutter - 处理有状态小部件的变量

Question

我有ListView小部件，其内容是动态加载的。

因此，我决定制作myStatelessWidget。

我的基本想法是

保持变量articles在StatefulWidget或State中的ListView上显示。

从外部传递内容。

所以现在，我这样写，但是有错误。

我的基本想法是正确的吗？还是应该在哪里解决？

//// to pass the argument from outside.
new BodyLayout(articles: myarticles),
////

class BodyLayout extends StatefulWidget {
  // List<Article> articles // ???I should put here/?
  BodyLayout({articles});
  @override
  _BodyLayoutState createState() => _BodyLayoutState();
}
class _BodyLayoutState extends State<BodyLayout>{
  // List<Article> articles // ???I should put here/?
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: widget.articles.length, // the getter 'articles' is not defined error....
      itemBuilder: (context, index) {
        return ListTile(
          title: Text(widget.articles[index].title),
          onTap: () => onTapped(context,widget.articles[index].url),
        );
      },
    );
  }
}

Answer 1

仅当要调用setState()方法以使用一些新状态重建小部件时，才需要使用有状态小部件。如果需要从某个api或数据库调用中检索文章列表，可以这样做的一种情况是，如果文章列表为null，则让小部件返回加载指示器，然后进行异步调用以检索文章。状态类的initState()方法，并在返回状态时，通过使用检索到的文章列表调用setState()来重建小部件。这样，也许:

/// to pass the argument from outside.
new BodyLayout(),
///

class BodyLayout extends StatefulWidget {
  BodyLayout();

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

class _BodyLayoutState extends State<BodyLayout>{

  List<Article> articles;
  bool loading = true;

  @override
  void initState(){
    _getArticles();
  }

  void getArticles() async {
    articles = await Repository.instance.getArticles(); //some async method to retrieve the articles
    setState((){
        loading = false;
    });    // after the articles are retrieved you can call setState to rebuild the widget
  }

  @override
  Widget build(BuildContext context) {
    if(loading) {
      return CircularProgressIndicator();
    }
    return ListView.builder(
      itemCount: articles.length,
      itemBuilder: (context, index) {
        return ListTile(
          title: Text(articles[index].title),
          onTap: () => onTapped(context, articles[index].url),
        );
      },
    );
  }
}

如果您有文章列表的开头，而无需重建列表，则可以将其设为无状态小部件并传递文章列表。

您指出的错误似乎是因为实际上没有将文章定义为该类的变量。 Dart支持多种语法选项来传递这样的实例变量，但这是我将定义该变量并确保在创建小部件(可以是无状态或有状态的小部件)时将其传递的方式:

//// to pass the argument from outside.
new BodyLayout(articles: myarticles),
////

class BodyLayout extends StatelessWidget {
  final List<Article> articles
  BodyLayout({this.articles}) : assert(articles != null);

  @override
  Widget build(BuildContext context){ ... };
}