Flutter Riverpod状态管理之AutoDisposeNotifierProvider

Flutter的Riverpod状态管理，目前来看是官方出的最好用的状态管理库了，今天我们主要看AutoDisposeNotifierProvider的使用，AutoDisposeNotifierProvider具有如下的优势：
1、自动释放资源：
AutoDisposeNotifierProvider会在Provider不被任何Widget监听时，自动释放其状态和资源，这对于需要管理大量资源的应用（如网络请求、数据库连接等）特别有用。
2、防止内存泄漏：
通过自动释放不再需要的状态，可以有效防止内存泄漏。
3、简化代码：
不需要手动管理Provider的生命周期，减少了样板代码，使代码更加简洁和易维护。
4、提高性能：
通过即使释放不再需要的资源，可以提高应用的性能，确保资源高效利用。

一、依赖库:

需要在pubspec.yaml中添加如下依赖：

dependencies:# 官方最新状态管理库flutter_riverpod: ^2.4.9# 通过注解(annotations)简化了Provider的定义，并与riverpod_generator配合使用，实现代码的自动生成。riverpod_annotation: ^2.3.3

dev_dependencies:# 可以自动生成各种类型的Provider，从而减少手动编写Provider的工作量。riverpod_generator: ^2.3.9# 用于代码生成，通过解析源代码并生成新的代码文件，帮助开发者自动生成重复性代码，从而提高开发效率，如序列化/反序列化、依赖注入、路由管理等。# 指令： flutter pub run build_runner buildbuild_runner: ^2.4.7

添加完需要拉取下依赖: flutter pub get 或 flutter pub upgrade

二、定义数据模型类：

RiverPodPage4Logic源码
通过注释中的6步骤，定义数据模型类，并准备生成对应xxx.g.dart文件

import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:startup_namer/util/print_util.dart';part 'riverpod_page4_logic.g.dart';///1、首先定义RiverPodPage4Logic类，并继承_$RiverPodPage4Logic
///2、添加注解@riverpod
///3、定义ViewModel类RiverPodPage4ViewModel
///4、覆写build方法，并返回RiverPodPage4ViewModel实例
///5、顶部添加：part 'riverpod_page4_logic.g.dart';
///6、终端执行指令：flutter pub run build_runner build
@riverpod
class RiverPodPage4Logic extends _$RiverPodPage4Logic {@overrideRiverPodPage4ViewModel build() {requestRemoteData();return RiverPodPage4ViewModel();}///模拟网络请求void requestRemoteData() {Future.delayed(const Duration(milliseconds: 2000), () {PrintUtil.print("request finished");String data = "remote data";//更新数据state = state.copyWith(data);});}
}class RiverPodPage4ViewModel {String data = "";RiverPodPage4ViewModel();RiverPodPage4ViewModel copyWith(String? data) {return RiverPodPage4ViewModel()..data = data ?? this.data;}
}

该类对应的dart文件名为：riverpod_page4_logic.dart

三、脚本生成xxx.g.dart类：

riverpod_page4_logic.g.dart源码
通过执行终端指令：

flutter pub run build_runner build
自动生成对应xxx.g.dart类，具体为：riverpod_page4_logic.g.dart

// GENERATED CODE - DO NOT MODIFY BY HANDpart of 'riverpod_page4_logic.dart';// **************************************************************************
// RiverpodGenerator
// **************************************************************************String _$riverPodPage4LogicHash() =>r'932c10533d58e940dac007c45624c7d0a8c5da06';/// See also [RiverPodPage4Logic].
@ProviderFor(RiverPodPage4Logic)
final riverPodPage4LogicProvider = AutoDisposeNotifierProvider<RiverPodPage4Logic, RiverPodPage4ViewModel>.internal(RiverPodPage4Logic.new,name: r'riverPodPage4LogicProvider',debugGetCreateSourceHash: const bool.fromEnvironment('dart.vm.product')? null: _$riverPodPage4LogicHash,dependencies: null,allTransitiveDependencies: null,
);typedef _$RiverPodPage4Logic = AutoDisposeNotifier<RiverPodPage4ViewModel>;
// ignore_for_file: type=lint
// ignore_for_file: subtype_of_sealed_class, invalid_use_of_internal_member, invalid_use_of_visible_for_testing_member

以上类为自动模板生成，不需要任何修改。

四、具体调用：

RiverPodPage4源码
在组件build方法中调用：
1、通过ref.watch来进行数据监听、更新;
2、通过ref.read来进行数据读取/notifier中方法调用；
3、当然也可以使用ref.listen来只做监听，不常用，这里不再过多介绍。

import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:startup_namer/base/common_base_state.dart';
import 'package:startup_namer/logic/riverpod_page4_logic.dart';///RiverPod状态管理页 --- 【AutoDisposeNotifierProvider】
class RiverPodPage4 extends ConsumerStatefulWidget {const RiverPodPage4({super.key});@overrideConsumerState<ConsumerStatefulWidget> createState() => _RiverPodPage4State();
}class _RiverPodPage4State extends CommonPageState<RiverPodPage4> {bool isRed = false;@overrideWidget buildPageContent(BuildContext context) {///通过ref.watch监听data，当接口数据请求成功后，会自动刷新build方法，更细UI。String data = ref.watch(riverPodPage4LogicProvider).data;///通过ref.watch监听isRed变量，当通过如下点击方法更新Model中其值时，由于这里使用了watch方法，也会自动更新build方法，刷新UI展示。isRed = ref.watch(riverPodPage4LogicProvider).isRed;return GestureDetector(onTap: () {///通过ref.read方法读取notifier，并通过内部updateBgColor方法更新其值ref.read(riverPodPage4LogicProvider.notifier).updateBgColor(!isRed);},child: Container(alignment: Alignment.center,///展示背景值decoration: BoxDecoration(color: isRed ? Colors.red : Colors.white),///展示数据child: Text("show Data:$data isRed:$isRed",style: const TextStyle(fontWeight: FontWeight.w700, fontSize: 16),),),);}
}