Flutter全局状态管理机

需求：
· 在我的界面，展示了用户信息姓名、年龄、性别等信息
· 我的界面有一个设置按钮，可以修改这些用户信息
· 修改之后怎么刷新呢？
· 这时候就使用到全局状态管理

dependencies:
  flutter:
    sdk: flutter

  flutter_redux: ^0.5.2  #全局状态管理机

eg：

// 再添加其他的全局类，都在初始化store时候添加进去
// YYRedux.dart

import 'package:ly_app/Model/UserInfo.dart'; // UserInfo类
import 'package:ly_app/Redux/UserInfoRedux.dart'; //UserInfoRedux类

// 需要全局的对象在YYState类里面添加
class YYState {
  UserInfo userInfo;

  YYState({this.userInfo});
}

// 创建store使用
YYState appReducer(YYState state, action) {
  return YYState(
    // 将全局对象和action关联
    userInfo: UserInfoReducer(state.userInfo, action),
  );
}

// UserInfoReducer.dart

import 'package:ly_app/Model/UserInfo.dart';
import 'package:redux/redux.dart'; // redux全局状态管理

/// redux 的 combineReducers, 通过 TypedReducer 将 UpdateUserInfoAction 与 reducers 关联起来
final UserInfoReducer = combineReducers<UserInfo>([
  TypedReducer<UserInfo, UpdateUserInfoAction>(_updateLoaded),
]);

/// 如果有 UpdateUserAction 发起一个请求时
/// 就会调用到 _updateLoaded
/// _updateLoaded 这里接受一个新的userInfo，并返回
/// 更新全局对象时候调用的方法
UserInfo _updateLoaded(UserInfo userInfo, action) {
  userInfo = action.userInfo;
  return userInfo;
}

class UpdateUserInfoAction {
  final UserInfo userInfo;
  UpdateUserInfoAction(this.userInfo);
}

// main.dart

import 'package:flutter/material.dart';

import 'package:flutter/cupertino.dart';
import 'package:ly_app/MainPage.dart';

import 'package:ly_app/Model/UserInfo.dart';

import 'package:redux/redux.dart';
import 'package:flutter_redux/flutter_redux.dart';
import 'package:ly_app/Redux/YYRedux.dart';

void main() {
  runApp(
    new Rooter()
  );
}

class Rooter extends StatelessWidget {
/// 在app入口 初始化全局状态管理对象store
/// StoreProvider 接收对象store
  final store = new Store<YYState>(appReducer, initialState: new YYState(userInfo: UserInfo.empty()));

  Rooter({Key key}) : super(key : key);

  @override
  Widget build(BuildContext context) {
    return new StoreProvider(
        store: store,
        child: new StoreBuilder<YYState>(builder: (context, store) {
            return new MainPage();
          }
        )
    );
  }
}

访问数据⏬

    StoreProvider.of(context).state.userInfo;

更新数据⏬

    StoreProvider.of(context).dispatch(new UpdateUserInfoAction(newUserInfo));

/// 在需要更新或者获取全局状态时候需要获取到store ⏬

Store<YYState> _getStore() {
  if (context == null) {
    print("YYState null");
    return null;
  }
  return StoreProvider.of(context);
}

/// 点击事件 更新全局状态 1、创建对象 2、调用更新方法⏬

onPressed: () {
  var map={"name":"更爱","id":2};
  UserInfo newUserInfo = UserInfo.fromJson(map);
  _getStore()?.dispatch(new UpdateUserInfoAction(newUserInfo));
}

/// 哪里需要使用全局状态，就在最外面new StoreBuilder⏬

@override
Widget build(BuildContext context) {
  return new StoreBuilder<YYState>(builder: (context, store) {
    return new Text(_getStore().state.userInfo.name)
  });

Flutter完整开发实战详解
Dio网络请求
UI界面