状态管理1Provider

Flutter页面跳转和传值传参，接收页面返回数据、以及解决返回（pop）页面时黑屏的问题

Flutter页面跳转和传值传参，接收页面返回数据、以及解决返回（pop）页面时黑屏的问题

flutter的渲染方式和移动端完全不同，它采用的React的思路。

移动端的UI控件可以通过修改其属性改变外观，但是flutter和RN，改变样式基本是靠重新渲染，所以想要更新内容，就要改变state，然后再通过setState()更新UI。

ReactNative的Redux

CQComponent/UIKit-Overlay-ReactNative/TSOverlayDemo/src/Redux

一、SetState

我们都知道，Flutter中Widget的状态控制了UI的更新，比如最常见的StatefulWidget，通过调用setState({})方法来刷新控件。那么其他类型的控件，比如StatelessWidget就不能更新状态来吗？答案当然是肯定可以的。前文已经介绍过几种状态管理

二、flutter全局状态管理器Provider

https://pub.dev/packages/provider/install

provider: ^4.3.1

为节省代码，我们以flutter全局状态管理器Provider中的代码为例，进行说明。

1、声明ChangeNotifier，类似于iOS中的Manager。

ChangeNotifier == Manager

ChangeNotifier 的 method == Manager 的 method

ChangeNotifier 的 notifyListeners == Manager 的 broadcast

ChangeNotifier 的 notifyListeners 的内部：Flutter系统提供的通知中心
Manager 的 broadcast 的内部：自己实现的多协议通知中心

import 'package:flutter/cupertino.dart';

class NumModel with ChangeNotifier{
  int _theNum;
  NumModel(this._theNum);
  /*_theNum递增*/
  void add() {
    _theNum++;
    notifyListeners();//通知所有监听的页面，如果写在runapp中那么通知所有页面重新加载
  }
  /*_theNum递减*/
  void reduction(){
    _theNum--;
    notifyListeners();
  }
  /*获取_theNum*/
  int get theNum => _theNum;
}

2、搭建监听系统，即搭建可以接收变化的结构

如果只监听一个model

main() {
  runApp(ChangeNotifierProvider<NumModel>.value(
    value: NumModel(1), 
    child: MyApp(),
  ));
}

如果监听多个model

main() {
  runApp(
      MultiProvider(providers: [
      ChangeNotifierProvider<NumModel>.value(value: NumModel(1)),
      ChangeNotifierProvider<NameModel>.value(value: NameModel("json"))
  ],
      child: MyApp()
  ));
}

我们的项目中很多情况下监听一个model是不够的，所以我们默认使用MultiProvider

个人理解：它类似将所有的监听放在了AppDelegate上。

3、使用Provider，发送变化

MaterialButton(
  onPressed: () {
    Provider.of<NumModel>(context).add();
  },
  child: Text("num递增"),
)

4、使用Provider，接收变化

Text(
  "name=" + Provider.of<NameModel>(context).theName,
  style: TextStyle(fontSize: 20, color: Colors.red),
)

BloC【Business Logic Component】