Flutter UI状态管理工具：Redux

在 Flutter Redux 中，StoreBuilder 是一个用于构建基于 Redux store 状态的 UI 组件的工具。

function有如下两种定义方式：

StoreBuilder：监听整个应用程序的状态

StoreBuilder ：监听特定页面的状态（HomePageState）

区别如下：

StoreBuilder(
  builder: (context, store) {
    // 这里可以访问整个 AppState
    var someGlobalValue = store.state.someGlobalValue;
    return Text(someGlobalValue);
  },
)

当使用 StoreBuilder 时，会构建一个能够访问并响应整个应用状态 (AppState) 变化的 widget。这意味着无论 AppState 的哪部分发生变化，这个 StoreBuilder 都可能被重建。

StoreBuilder(
  builder: (context, store) {
    // 这里可以访问 HomePageState
    var homePageValue = store.state.homePageState.someHomePageValue;
    return Text(homePageValue);
  },
)

当使用 StoreBuilder 时，会构建一个专门响应 HomePageState 变化的 widget。这意味着只有当 HomePageState 部分发生变化时，这个 StoreBuilder 才会被重建。这对于性能优化很有帮助，因为它避免了不必要的重建。

But，通常不会有如：StoreBuilder的用法

因为 Redux 在设计时，是围绕着一个单一的全局状态对象——通常称为 AppState 或 Store ——来构建的。这个全局状态对象包含了整个应用的所有状态信息。

但也可以这样用，如以下情景：

如果应用采用了多个 Redux Store 而不是单一全局 Store 的架构，那么在这种情况下，将会有StoreBuilder 的用法。每个 Store 管理应用的不同部分

（但是这种用法违背了一个重要原则：单一数据源）。

同时据笔者了解，这个Redux框架广泛应用于React，同时Flutter也有着其他状态管理工具可供选择。

Redux 的重要核心概念：Action。

Action 是改变应用状态（存储在 Redux store 中）的唯一方式。每个 action 都有一个 type 属性，它是一个字符串常量，Action 描述了在应用中发生了什么。例如，用户操作、API 请求等都可以触发 action。

// 定义一个 Action
class AddTodoAction {
  final String todo;

  AddTodoAction(this.todo);
}

为了简化 action 的创建，可以定义一个 action creator，它是一个返回 action 的函数。

// Action Creator
AddTodoAction addTodoAction(String todo) {
  return AddTodoAction(todo);
}

Action 本身不直接改变应用的状态；它仅仅是一个描述“发生了什么”的消息。状态的实际改变是在 reducers 中处理的。

// 假设你有一个状态列表用于存储待办事项
List todosReducer(List todos, dynamic action) {
  if (action is AddTodoAction) {
    return List.from(todos)..add(action.todo);
  }
  return todos;
}

当 action 被发送（通常称为“分发”）时，Redux store 的 reducer 会接收到这个 action，并根据 action 的类型和数据来更新状态。

// 创建 Action
var action = AddTodoAction('Learn Redux with Dart');

// 分发 Action
store.dispatch(action);

如上。