添加依赖

dependencies:
	provider: ^4.3.2+4

MultiProvider

对多个 Provider 整理

name description
Provider 最基础的 provider 组成,接收一个值并暴露它, 无论值是什么。
ListenableProvider 供可监听对象使用的特殊 provider,ListenableProvider 会监听对象,并在监听器被调用时更新依赖此对象的 widgets。
ChangeNotifierProvider 为 ChangeNotifier 提供的 ListenableProvider 规范,会在需要时自动调用ChangeNotifier.dispose
ValueListenableProvider 监听 ValueListenable,并且只暴露出ValueListenable.value
StreamProvider 监听流,并暴露出当前的最新值。
FutureProvider 接收一个Future,并在其进入 complete 状态时更新依赖它的组件。

Provider

最基础的 provider 组成,接收一个值并暴露它, 无论值是什么。但是不是会 ui 上刷新

生成 model

class CountModel {
  // 全局状态
  int count = 0;
  // 状态指定方法
  add() {
    this.count++;
    print(this.count);
  }
}

main.dart

import 'package:FlutterProvider/model/CountModel.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

main() {
  runApp(
    // 使用Provider管理
    Provider<CountModel>(
      create: (_) {
        return CountModel(0);
      },
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Provider",
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 获取Provider管理的model
    CountModel count = Provider.of<CountModel>(context);
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter Provider"),
      ),
      body: Center(
        child: Text("当前的值:${count.count.toString()}"),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 调用model中的方法,会在control中输出,但是不会在ui上更新
          count.add();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

ChangeNotifierProvider(常用)

为 ChangeNotifier 提供的 ListenableProvider 规范,会在需要时自动调用ChangeNotifier.dispose

CountModel.dart

import 'package:flutter/foundation.dart';

class CountModel with ChangeNotifier {
  // 全局状态
  int count;
  // 初始构造函数
  CountModel(this.count);
  // 状态指定方法
  add() {
    this.count++;
    print(this.count);
    // 通知所有ui刷新
    notifyListeners();
  }
}

MultiProvide

当在大型应用中注入较多状态时, Provider 很容易变得高度耦合

嵌套写法

main() {
  runApp(
    // 使用Provider管理
    ChangeNotifierProvider<FristModel>(
      create: (BuildContext context) {
        return FristModel("Rm");
      },
      child: ChangeNotifierProvider<CountModel>(
        create: (_) {
          return CountModel(0);
        },
        child: MyApp(),
      ),
    ),
  );
}

MultiProvider

main() {
  runApp(MultiProvider(
    providers: [
      ChangeNotifierProvider<CountModel>(create: (_) => CountModel(0)),
      ChangeNotifierProvider<FristModel>(create: (_) => FristModel("Rm")),
    ],
    child: MyApp(),
  ));
}