Flutter 状态管理17 Mar 2025 | 5 分钟阅读 在本节中,我们将讨论状态管理以及如何在 Flutter 中处理它。 我们知道在 Flutter 中,一切都是一个 Widget。 Widget 可以分为两类:一个是 Stateless widget(无状态 Widget),另一个是 Stateful widget(有状态 Widget)。 无状态 Widget 没有内部状态。 这意味着一旦构建完成,除非再次初始化,否则我们无法更改或修改它。 另一方面,有状态 Widget 是动态的并且具有状态。 这意味着我们可以很容易地在其整个生命周期中修改它,而无需再次重新初始化它。 什么是状态?状态是 Widget 构建时可以被 读取 的信息,并且可能会在应用程序的生命周期中 更改或修改。 如果你想改变你的 Widget,你需要更新状态对象,这可以通过使用 Stateful widget 中提供的 setState() 函数来完成。 setState() 函数允许我们设置状态 对象 的属性,从而触发 UI 的重绘。 状态管理是应用程序生命周期中最流行和最必要的过程之一。 根据官方文档,Flutter 是声明式的。 这意味着 Flutter 通过反映应用程序的当前状态来构建其 UI。 下图更清楚地解释了如何从应用程序状态构建 UI。 ![]() 让我们举一个简单的例子来理解状态管理的概念。 假设您在应用程序中创建了一个客户或产品列表。 现在,假设您在该列表中动态地添加了一个新的客户或产品。 那么,就需要刷新列表,以便在记录中查看新添加的项目。 因此,无论何时添加新项目,都需要刷新列表。 这种类型的编程需要状态管理来处理这种情况,以提高性能。 这是因为每次您进行更改或更新时,状态都会刷新。 在 Flutter 中,状态管理分为两种概念类型,如下所示:
瞬态状态(Ephemeral State)此状态也称为 UI 状态或本地状态。 这是一种与 特定 Widget 相关的状态类型,或者您可以说它是一个包含在单个 Widget 中的状态。 在这种状态下,你不需要使用状态管理技术。 这种状态的常见例子是 文本字段(Text Field)。 示例 在上面的例子中,_name 是一个瞬态状态。 在这里,只有 StatefulWidget 类的内部的 setState() 函数可以访问 _name。 build 方法调用 setState() 函数,该函数修改状态变量。 当这个方法被执行时,Widget 对象会被新的对象替换,从而给出修改后的变量值。 应用状态(App State)它与瞬态状态不同。 这是一种我们希望在应用程序的各个部分 共享 并且希望在用户会话之间保留的状态类型。 因此,这种类型的状态可以全局使用。 有时它也被称为应用程序状态或共享状态。 这种状态的一些例子包括:用户偏好设置、登录信息、社交网络应用中的通知、电子商务应用中的购物车、新闻应用中文章的已读/未读状态等。 下图更恰当地解释了瞬态状态和应用状态之间的区别。 ![]() 可以通过使用 provider 包 学习应用状态管理的最简单示例。 使用 provider 进行状态管理易于理解并且需要较少的编码。 Provider 是一个 第三方 库。 在这里,我们需要理解三个主要概念才能使用这个库。
ChangeNotifierChangeNotifier 是一个简单的类,它向其监听器提供更改通知。 它易于理解、实现,并针对少量监听器进行了优化。 它用于监听器观察模型的更改。 在这种方法中,我们只使用 notifyListener() 方法来通知监听器。 例如,让我们定义一个基于 ChangeNotifier 的模型。 在这个模型中,Counter 扩展了 ChangeNotifier,用于在我们调用 notifyListeners() 时通知其监听器。 这是 ChangeNotifier 模型中需要实现的唯一方法。 在这个例子中,我们声明了两个函数:increment 和 decrement,用于增加和减少值。 我们可以在模型以可能改变应用程序 UI 的方式改变时随时调用 notifyListeners() 方法。 ChangeNotifierProviderChangeNotifierProvider 是一个 Widget,它向其后代提供 ChangeNotifier 的一个 实例。 它来自 provider 包。 以下代码片段有助于理解 ChangeNotifierProvider 的概念。 在这里,我们定义了一个 builder,它将创建一个 Counter 模型的新实例。 除非有需要,否则 ChangeNotifierProvider 不会重建 Counter。 当不再需要该实例时,它也会自动调用 Counter 模型上的 dispose() 方法。 如果需要提供多个类,可以使用 MultiProvider。 MultiProvider 是在其范围内使用的所有不同 Provider 的列表。 如果不使用它,我们将不得不嵌套我们的 Provider,一个作为另一个的子节点。 我们可以从下面的代码中理解这一点。 Consumer这是一种不执行任何复杂工作的 Provider。 它只是在一个新的 Widget 中调用 Provider 并将其构建实现委托给 builder。 以下代码更清楚地解释了这一点。/p> 在上面的例子中,您可以看到 consumer widget(消费者 Widget) 只需要一个构建器函数,该函数在 ChangeNotifier 更改时被调用。 构建器函数包含 三个 参数,分别是 context(上下文)、count(计数) 和 child(子节点)。 第一个参数 context 包含在每个 build() 方法中。 第二个参数是 ChangeNotifier 的实例,第三个参数是用于优化的子节点。 最好尽可能地将消费者 Widget 放置在树的深处。 下一主题Flutter IDE |
我们请求您订阅我们的新闻通讯以获取最新更新。