How to refresh previous page when using back button in Flutter?

- Andrés Cruz

En español
How to refresh previous page when using back button in Flutter?

When we work with CRUD-type operations in any programming language, framework, etc., when we are in the creation or update phase, generally at the end of this process we automatically return to the listing page, which must reflect the changes reflected in the processes of insertion or update of these records; for these cases, when we are working in Flutter it may not be entirely clear how we can do this update of the list view; We're no longer talking about firing a function when the back button is pressed, as this would only affect the current page before back.

Navigation in Flutter

Let's remember that, when we want to go from one page to another, we have to use a navigation component that we have thanks to a class called Navigator in Flutter; What may not be so clear is that this same navigation works for us when we go back to execute the code that we want to execute when we return to the initial page, which in our example would be the list page; we can intercept when we route with the Navigator class by using the then function, which is a promise function:

ListTile(
          title: Text(notes[i].title),
          trailing: MaterialButton(
            onPressed: () => Navigator.pushNamed(context, SavePage.ROUTE,
                    arguments: notes[i])
                .then((value) => setState(() {
                      _loadData();
                    })),
            child: Icon(Icons.edit),
          )),

Therefore, in our example, we have a function to reload the data, which is the same one we used to load the data initially.

Andrés Cruz

Develop with Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz In Udemy

I agree to receive announcements of interest about this Blog.