Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – Equatable doesn't work in bloc event and always triggered with same value

I implemented equatable in bloc event to prevent if the data that i push is same or not with before.

push event

BlocProvider.of<FeedbackBloc>(context) 
      .add(SubmitFeedbackEvent(userFeedback: 'Hallo!'));

from event file

sealed class FeedbackEvent extends Equatable {
  const FeedbackEvent();

  @override
  List<Object> get props => [];
}

final class SubmitFeedbackEvent extends FeedbackEvent {
  const SubmitFeedbackEvent({required this.userFeedback});

  final String userFeedback;

  @override
  List<Object> get props => [userFeedback];
}

from bloc file

class FeedbackBloc extends Bloc<FeedbackEvent, FeedbackState> {
  FeedbackBloc() : super() {
    on<SubmitFeedbackEvent>((event, emit) async {

      final userFeedback = event.userFeedback;

      print(userFeedback);

    });
  }
}

But when i check the event, it still trigger every time i push with same value userFeedback

when i click button 5 times to push event:

expectation

Output:
Hallo!

reality

Output:

Hallo!

Hallo!

Hallo!

Hallo!

Hallo!

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I agree with statement from @Waseem Abbas above,

    The Equatable package helps in comparing two objects to see if they are considered equal. This is particularly useful for state comparison to prevent unnecessary UI rebuilds. However, it doesn’t prevent the Bloc from processing identical events. Even if two events are equal, the Bloc will handle them because each add call creates a new instance of SubmitFeedbackEvent. So Bloc processes each event because they are separate instances.

    Another developer also experience it too. But i have another solve that more tidy and provided by Bloc creator.

    My solve, i use bloc_concurrency

    So, i implement 'transformer: droppable()' from bloc_concurrency. Why i use droppable? because i try to cancel all push events when the first push event still on progress. So when user click button sequently 5 times, the event only accept trigger once.

    // file_bloc.dart

on<SubmitFeedbackEvent>(
  transformer: droppable(),
  (event, emit) async {

    // do your code in here

    emit(ToState());

  },
);

  2. 0

    The behavior you’re observing occurs because of how events are being handled in your FeedbackBloc.

    The Equatable package helps in comparing two objects to see if they are considered equal. This is particularly useful for state comparison to prevent unnecessary UI rebuilds. However, it doesn’t prevent the Bloc from processing identical events. Even if two events are equal, the Bloc will handle them because each add call creates a new instance of SubmitFeedbackEvent. So Bloc processes each event because they are separate instances.

    If your goal is to prevent processing the same event multiple times, you’ll need to implement additional logic within your FeedbackBloc to track the last processed event and compare it with the new one.

    class FeedbackBloc extends Bloc<FeedbackEvent, FeedbackState> {
  FeedbackBloc() : super() {
    on<SubmitFeedbackEvent>((event, emit) async {
      if (_lastEvent == event) {
        print('Duplicate event detected, ignoring.');
        return;
      }

      _lastEvent = event;

      final userFeedback = event.userFeedback;
      print(userFeedback);

      // Handle your event logic here
    });
  }

  SubmitFeedbackEvent? _lastEvent;  // Track the last processed event
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search