Provider值变更时作为ListTile的自定义部件未触发更新

• Provider.of(context, listen: false) 的作用仅为获取Provider实例，不会订阅状态变化，因此状态更新后不会触发组件重建，属于预期行为。
• 当listen设为true时，当前context对应的整个组件都会监听Provider的所有状态变化，只要调用notifyListeners就会触发全局重绘，若列表内ListTile数量较多，会产生大量冗余重绘，自然会出现卡顿。

仅让每个ListTile监听自身对应房间ID的消息变化，其他房间的消息更新不会触发当前组件重绘，从根源降低重绘次数，解决卡顿问题。

1. 调整Stream订阅逻辑 #

将Stream订阅逻辑放在State的initState生命周期中，dispose时主动取消订阅，避免重复创建订阅和内存泄漏：

class CustomListTileState extends State<CustomListTile> {
  late StreamSubscription<Event> updates;
  late LastMessage messageInstance;

  @override
  void initState() {
    super.initState();
    // 此处listen设为false即可，仅用于获取实例不需要订阅变化
    messageInstance = Provider.of<global.LastMessage>(context, listen: false);
    _initStreamListener();
  }

  void _initStreamListener() {
    final roomId = widget.roomId; // 当前ListTile对应的房间ID
    updates = ref.child(roomId).onChildAdded.listen((event) async {
      String latestMsg = await getLastMessage();
      messageInstance.updateMap(roomId, latestMsg);
    });
  }

  @override
  void dispose() {
    updates.cancel(); // 必须取消订阅防止内存泄漏
    super.dispose();
  }

2. 用Selector替换全局Provider.of监听 #

在组件的build方法中使用Selector，仅订阅当前房间ID对应的消息值：

@override
  Widget build(BuildContext context) {
    return Selector<LastMessage, String?>(
      // 仅筛选当前ListTile对应房间的消息
      selector: (context, lastMessageProvider) => lastMessageProvider.messageMap[widget.roomId],
      // 可选配置：只有消息内容真的发生变化时才触发重绘
      shouldRebuild: (previousMsg, newMsg) => previousMsg != newMsg,
      builder: (context, currentLastMessage, child) {
        // 仅当前房间的消息更新时，才会执行该builder重绘ListTile
        return ListTile(
          title: Text(currentLastMessage ?? "暂无新消息"),
          // 其余ListTile配置
        );
      },
    );
  }
}

如果你的消息列表有上百个以上的ListTile，可以进一步给ListTile的静态子组件加const修饰，减少重绘时的渲染开销。

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