3 
class ListItem extends StatefulWidget {
  final Product product;

  ListItem(this.bloc, this.product);

  @override
  _ListItemState createState() => _ListItemState(product);
}

class _ListItemState extends State<ListItem> {
  Product product;
  _ListItemState(this.product);

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(product.title),
      trailing: LikeIcon(
        id: product.id,
        isFavourite: product.isFavorite,
        likeStatusHandler: toggleLikeStatus,
      ),
    );
  }
}

class LikeIcon extends StatefulWidget {
  final int id;
  final bool isFavourite;
  final Function(int) likeStatusHandler;

  LikeIcon({
    @required this.id,
    @required this.isFavourite,
    @required this.likeStatusHandler,
  });

  @override
  _LikeIconState createState() => _LikeIconState(isFavourite);
}

class _LikeIconState extends State<LikeIcon> {
  bool isFavourite;

  _LikeIconState(isFavourite) {
    this.isFavourite = isFavourite;
  }

  @override
  Widget build(BuildContext context) {
    return _favouriteWidget();
  }
}

最初，我将 ListItem 小部件设置为 StatelessWidget，并将 LikeIcon 小部件设置为 StatefulWidget，它控制着 Like 图标的启用/禁用状态。我遇到的问题是，当我滚动列表时，类似的状态丢失了。

后来我将 ListItem 本身作为 StatefulWidget 并解决了这个问题。但是看到日志，我注意到每次滚动时都会重建 ListItem（正在调用 build 方法）。

如果 ListItem 是 StatelessWidget，则在滚动时不会调用 build 方法。在每个滚动条上重建整个 ListItem 是我关心的事情，尤其是涉及包含图像的大型数据集。

任何更深层次的解释都值得赞赏。

4

0 回答 0