如何将自定义Planets类的数据传递到Stateful页面中使用

实现步骤 #

1. 首先确保你定义的Planets类和recentList列表与MyHomePage在同一dart文件，若不在同一文件需要先引入对应文件。
2. 若你使用的是支持空安全的Flutter版本，需要先调整原Planets类代码避免编译报错，调整后代码如下：

class Planets {
  final String cover;

  Planets({
    required this.cover, // 若cover允许为空可将类型改为String?，去掉required关键字
  });
}
List<Planets> recentList = [
  Planets(
    cover: "https://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Planets2013.svg/260px-Planets2013.svg.png"
  ),
];

3. 补全MyHomePage组件代码，直接在build方法中调用recentList对应下标的元素的cover属性即可，完整示例如下：

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 此处以body直接展示单张图片为例，你也可以将Image组件放在任意需要的节点位置
      body: Image.network(
        recentList[0].cover, // 要取列表其他元素的话修改对应的数组下标即可
        fit: BoxFit.cover,
        height: 200,
        width: MediaQuery.of(context).size.width,
      ),
    );
  }
}

如果你需要遍历展示recentList所有元素的封面图片，可以用列表组件实现：

body: ListView.builder(
  itemCount: recentList.length,
  itemBuilder: (context, index) {
    return Image.network(
      recentList[index].cover,
      fit: BoxFit.cover,
      height: 200,
      width: MediaQuery.of(context).size.width,
    );
  },
)

内容的提问来源于stack exchange，提问作者LaurenTsai