CINXE.COM

<!DOCTYPE html> <html lang="en"><head><script type="text/javascript" src="https://www.googletagmanager.com/gtm.js?id=GTM-MX6DBN9" async="async"></script><script type="text/javascript" src="/static/hash-kioktj30/js/gtm.js"></script><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=no"/><meta name="generator" content="made with love by dartdoc"/><meta name="description" content="riverpod API docs, for the Dart programming language."/><title>riverpod - Dart API docs</title><link rel="canonical" href="https://pub.dev/documentation/riverpod/latest/"/><link rel="preconnect" href="https://fonts.gstatic.com"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0"/><link rel="stylesheet" href="/static/hash-kioktj30/css/dartdoc.css"/><link rel="icon" href="/favicon.ico?hash=nk4nss8c7444fg0chird9erqef2vkhb8"/></head><body class="light-theme" data-base-href="" data-using-base-href="false"><noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MX6DBN9" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><div id="overlay-under-drawer"></div><header id="title"><span id="sidenav-left-toggle" class="material-symbols-outlined" role="button" tabindex="0">menu</span><a class="hidden-xs" href="/"><img src="/static/hash-kioktj30/img/dart-logo.svg" alt="" width="30" height="30" role="presentation" style="height: 30px; margin-right: 1em;"/></a><ol class="breadcrumbs gt-separated dark hidden-xs"><li><a href="/packages/riverpod">riverpod package</a></li><li class="self-crumb">documentation</li></ol><div class="self-name">riverpod package</div><form class="search navbar-right" role="search"><input id="search-box" class="form-control typeahead" type="text" placeholder="Loading search..." autocomplete="off"/></form><div id="theme-button" class="toggle" title="Toggle brightness"><label for="theme"><input id="theme" type="checkbox" value="light-theme"/><span id="dark-theme-button" class="material-symbols-outlined">dark_mode</span><span id="light-theme-button" class="material-symbols-outlined">light_mode</span></label></div></header><main><div id="dartdoc-main-content" class="main-content"> <div class="desc markdown markdown-body"> <p> <a href="https://flutter.dev/docs/development/packages-and-plugins/favorites" rel="ugc"> <img src="https://raw.githubusercontent.com/rrousselGit/riverpod/master/resources/flutter_favorite.png" width="100" align="left"> </a> <a href="https://github.com/rrousselGit/riverpod/actions" rel="ugc nofollow"><img src="https://github.com/rrousselGit/riverpod/workflows/Build/badge.svg" alt="Build Status"></a> <a href="https://codecov.io/gh/rrousselgit/riverpod" rel="ugc nofollow"><img src="https://codecov.io/gh/rrousselgit/riverpod/branch/master/graph/badge.svg" alt="codecov"></a> <a href="https://github.com/rrousselgit/riverpod" rel="ugc nofollow"><img src="https://img.shields.io/github/stars/rrousselgit/riverpod.svg?style=flat&logo=github&colorB=deeppink&label=stars" alt="Star on Github"></a> <a href="https://opensource.org/licenses/MIT" rel="ugc nofollow"><img src="https://img.shields.io/badge/license-MIT-purple.svg" alt="License: MIT"></a> <a href="https://discord.gg/Bbumvej" rel="ugc nofollow"><img src="https://img.shields.io/discord/765557403865186374.svg?logo=discord&color=blue" alt="Discord"></a> </p><p> <a href="https://www.netlify.com" rel="ugc nofollow"> <img src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" alt="Deploys by Netlify"> </a> </p> <p></p> <p align="center"> <img src="https://github.com/rrousselGit/riverpod/blob/master/resources/icon/Facebook%20Cover%20A.png?raw=true" width="100%" alt="Riverpod"> </p> <hr> <p>A reactive caching and data-binding framework. <a href="https://riverpod.dev" rel="ugc nofollow">https://riverpod.dev</a> Riverpod makes working with asynchronous code a breeze by:</p> <ul> <li>handling errors/loading states by default. No need to manually catch errors</li> <li>natively supporting advanced scenarios, such as pull-to-refresh</li> <li>separating the logic from your UI</li> <li>ensuring your code is testable, scalable and reusable</li> </ul> <table> <thead> <tr> <th>riverpod</th> <th><a href="https://pub.dartlang.org/packages/riverpod" rel="ugc nofollow"><img src="https://img.shields.io/pub/v/riverpod.svg?label=riverpod&color=blue" alt="pub package"></a></th> </tr> </thead> <tbody> <tr> <td>flutter_riverpod</td> <td><a href="https://pub.dartlang.org/packages/flutter_riverpod" rel="ugc nofollow"><img src="https://img.shields.io/pub/v/riverpod.svg?label=flutter_riverpod&color=blue" alt="pub package"></a></td> </tr> <tr> <td>hooks_riverpod</td> <td><a href="https://pub.dartlang.org/packages/hooks_riverpod" rel="ugc nofollow"><img src="https://img.shields.io/pub/v/riverpod.svg?label=hooks_riverpod&color=blue" alt="pub package"></a></td> </tr> </tbody> </table> <p>Welcome to <a href="https://github.com/rrousselGit/riverpod" rel="ugc nofollow">Riverpod</a> (anagram of <a href="https://github.com/rrousselGit/provider" rel="ugc nofollow">Provider</a>)!</p> <p>For learning how to use <a href="https://github.com/rrousselGit/riverpod" rel="ugc nofollow">Riverpod</a>, see its documentation: >>> <a href="https://riverpod.dev" rel="ugc nofollow">https://riverpod.dev</a> <<<</p> <p>Long story short:</p> <ul> <li> <p>Define network requests by writing a function annotated with <code>@riverpod</code>:</p> <pre class="language-dart"><code class="language-dart">@riverpod Future<String> boredSuggestion(Ref ref) async { final response = await http.get( Uri.https('boredapi.com', '/api/activity'), ); final json = jsonDecode(response.body); return json['activity']! as String; } </code></pre> </li> <li> <p>Listen to the network request in your UI and gracefully handle loading/error states.</p> <pre class="language-dart"><code class="language-dart">class Home extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { final boredSuggestion = ref.watch(boredSuggestionProvider); // Perform a switch-case on the result to handle loading/error states return switch (boredSuggestion) { AsyncData(:final value) => Text('data: $value'), AsyncError(:final error) => Text('error: $error'), _ => const Text('loading'), }; } } </code></pre> </li> </ul> <h2 id="contributing">Contributing</h2> <p>Contributions are welcome!</p> <p>Here is a curated list of how you can help:</p> <ul> <li>Report bugs and scenarios that are difficult to implement</li> <li>Report parts of the documentation that are unclear</li> <li>Fix typos/grammar mistakes</li> <li>Update the documentation or add examples</li> <li>Implement new features by making a pull-request</li> </ul> <h2 id="sponsors">Sponsors</h2> <p align="center"> <a href="https://raw.githubusercontent.com/rrousselGit/freezed/master/sponsorkit/sponsors.svg" rel="ugc nofollow"> <img src="https://raw.githubusercontent.com/rrousselGit/freezed/master/sponsorkit/sponsors.svg"> </a> </p> </div> <div class="summary"> <h2>Libraries</h2> <dl> <dt id="riverpod"> <span class="name"><a href="riverpod">riverpod</a></span> </dt> <dd> </dd> </dl> </div> </div><div id="dartdoc-sidebar-left" class="sidebar sidebar-offcanvas-left"><header id="header-search-sidebar" class="hidden-l"><form class="search-sidebar" role="search"><input id="search-sidebar" class="form-control typeahead" type="text" placeholder="Loading search..." autocomplete="off"/></form></header><ol id="sidebar-nav" class="breadcrumbs gt-separated dark hidden-l"><li><a href="/packages/riverpod">riverpod package</a></li><li class="self-crumb">documentation</li></ol>  <h5 class="hidden-xs"><span class="package-name">riverpod</span> <span class="package-kind">package</span></h5> <ol> <li class="section-title">Libraries</li> <li><a href="riverpod">riverpod</a></li> </ol> <div id="dartdoc-sidebar-left-content"></div></div><div id="dartdoc-sidebar-right" class="sidebar sidebar-offcanvas-right"> </div></main><footer><span class="no-break">riverpod 2.6.1</span></footer><script src="/static/hash-kioktj30/dartdoc/resources/highlight.pack.js"></script><script src="/static/hash-kioktj30/dartdoc/resources/docs.dart.js"></script></body></html>