I was just making a simple note app to learn about Flutter Bloc. In app, there are 2 screens. 1 for Listing notes from database. 2 for adding or editing note. After adding note successfully when come back to second screen at first time it shows RangeError. actually bloc is not adding event. but don't know how to solve? but it working after closes the app and restart it. It shows data in list screen.

import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:notes_bloc/bloc/form/noteform_bloc.dart';
import 'package:notes_bloc/bloc/list/notelist_bloc.dart';
import 'package:notes_bloc/model/note.dart';

class NoteFormScreen extends StatefulWidget {
  @override
  _NoteFormScreenState createState() => _NoteFormScreenState();
}

class _NoteFormScreenState extends State<NoteFormScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            BlocProvider.of<NoteFormBloc>(context)
                .add(NoteSaveEvent(note: Note(title: 'hi', content: 'bye')));
            BlocProvider.of<NoteListBloc>(context).add(GetNotesEvent());
          },
        ),
      ),
    );
  }

}

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:notes_bloc/bloc/list/notelist_bloc.dart';
import 'package:notes_bloc/ui/screens/note_form_screen.dart';

class NotesListScreen extends StatefulWidget {
  static const routeName = '/notes_list';

  static Route route() {
    return MaterialPageRoute(
        settings: RouteSettings(name: routeName),
        builder: (_) => NotesListScreen());
  }

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

class _NotesListScreenState extends State<NotesListScreen> {
  NoteListBloc noteListBloc;
  @override
  void initState() {
    super.initState();

    noteListBloc = BlocProvider.of<NoteListBloc>(context);
    noteListBloc.add(GetNotesEvent());

    print('inside initstate');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: BlocBuilder<NoteListBloc, NoteListState>(
          builder: (context, state) {
            if (state is GetNoteListState) {
              if (state.note != null) {
                return Text(state.note[0].title);
              }
            }
            return Text('nothing ');
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Navigator.of(context).push(
            MaterialPageRoute(
              builder: (context) => NoteFormScreen(),
            ),
          );
        },
      ),
    );
  }
}


Solution 1: PatrickMahomes

if (state.note != null) {
return Text(state.note[0].title);
}

This part is an issue. You are checking if state.note is null, but not if it is empty ([]). If it's empty then using state.note[0] will give you a RangeError because there is nothing at index 0.


Solution 2: Jhoan Marquina

invoke the method in this function instead of the one in initState

 @override
  void didChangeDependencies() {
    noteListBloc = BlocProvider.of<NoteListBloc>(context);
    noteListBloc.add(GetNotesEvent());

  super.didChangeDependencies();
 }