flutter状态管理Provider的简单使用

如果大量的使用statefulwidget，将会导致状态混乱，难以管理，使用provider进行统一管理可以很好的解决这个问题，也避免大量的使用statefulwidget从而降低性能。
先上效果：

这里我使用的MultiProvider同时管理多个provider:
首先是main文件

/**
 * 入口
 * author: djytwy on 2019-11-05 14:57
 */

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:catcher/catcher_plugin.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:tai_intelligent/models/register.dart';
import 'package:tai_intelligent/pages/common/login.dart';
import './utils/utils.dart';
import 'pages/errorPage.dart';
import 'pages/common/register.dart';
import 'pages/common/login.dart';
import 'pages/home/home.dart';
// 引入provider
import 'package:provider/provider.dart';
// 引入model
import 'models/register.dart';

main() {
  // 异常处理
  CatcherOptions debugOptions = CatcherOptions(ErrorPageReportMode(), [
    HttpHandler(
      HttpRequestType.post,
      // 错误上报地址，
      Uri.parse('http://192.168.31.233/'),
      headers: {
        'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.70 Safari/537.36'
      },
    ),
    ConsoleHandler(),
  ]);
  CatcherOptions releaseOptions = CatcherOptions(ErrorPageReportMode(), [
    HttpHandler(
      HttpRequestType.post,
      Uri.parse('http://192.168.31.233/'),
      headers: {
        'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.70 Safari/537.36'
      },
    ),
    ConsoleHandler()
  ]);
  Catcher(MyApp(), debugConfig: debugOptions, releaseConfig: releaseOptions);
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    // 初始化自适应插件
    return MultiProvider(     /// 注意MultiProvider的用法！
      providers: [
        ChangeNotifierProvider(builder: (_) => PostData({})),
      ],
      child:  MaterialApp(
            navigatorKey: Catcher.navigatorKey,
            home: Scaffold(
              appBar: AppBar(
                title: const Text('Plugin example app'),
              ),
              body: ChildWidget()),
            routes: <String, WidgetBuilder> {
              '/login': (context) => Login(),
              '/register': (context) => Register(),
              '/home': (context) => Home(),
            },
          );
    );
  }
}

class ChildWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    ScreenUtil.instance = ScreenUtil(width: 750, height: 1334)..init(context);
    return Container(
      child: Column(
        children: <Widget>[
          FlatButton(child: Text('错误'), onPressed: () => generateError()),
          RaisedButton(child: Text('注册'), onPressed: (){register(context);}),
          RaisedButton(child: Text('登录'), onPressed: (){login(context);}),
          RaisedButton(child: Text('主页'), onPressed: (){home(context);}),
        ],
      )
    );
  }

  void register(context) {
    Navigator.pushNamed(context, '/register');
  }

  void login(context) {
    Navigator.pushNamed(context, '/login');
  }

  void home(context) {
    Navigator.pushNamed(context, '/home');
  }

  generateError() async {
    throw '出错';
  }
}

model文件：

/**
 * 注册页的model
 * author: djytwy on 2019-11-07 18:34
 */

import 'package:flutter/material.dart';

class PostData with ChangeNotifier {
// 要设置的值
  Map<String, dynamic> _postData;

  // 初始化时赋值
  PostData(this._postData);

  // 设置值
  void setValue(key,value) {
    _postData[key] = value;
    notifyListeners();
  }

  // 清空值
  void clear(){
    _postData = {};
  }

  // 获取值
  get postData => _postData;
}

使用：

/**
 * 主页 （登录后先获取权限，再渲染内容）
 * author: djytwy on 2019-11-06 16:05
 */
import 'package:flutter/material.dart';
// 引入provider
import 'package:provider/provider.dart';
// 引入model
import '../../models/register.dart';

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        elevation: 0.0,
        backgroundColor: Color.fromARGB(255, 45, 140, 240),
        title: Center(
          child: Container(
            margin: EdgeInsets.only(right: utils.setWidth(100.0)),
            child: Text('DEMO')
        )),
      ),
      body: Container(
        child: Stack(
            Positioned(
              top: 400.0,
              // 用法在这里！
              child: Text('provider: ${Provider.of<PostData>(context).postData}'),
            )，
            Positioned(
              top: 500.0,
              child: RaisedButton(
                child: Text('赋值'),
                onPressed: (){_setProvider(context);}
              )
            )
          ],
        )
      ),
    );
  }

  void _setProvider(_context){
    Provider.of<PostData>(_context).setValue('test', 'my test !');
  }
}

PS：在最新的4.0.2版本中的改动

需要加listen:false
例如上面的代码中：

Provider.of<PostData>(context).postData

改为：

Provider.of<PostData>(context, listen:false).postData