面试题：Flutter 中 StatefulWidget 与 Provider 在状态管理上的主要区别

Question

请详细阐述在 Flutter 项目里，StatefulWidget 与 Provider 在状态管理机制、适用场景等方面有哪些主要区别，并举例说明在什么类型的功能模块中会优先选择 StatefulWidget 或 Provider 进行状态管理。

Answer 1

状态管理机制

• StatefulWidget：
  • StatefulWidget 有自己独立的状态（State 对象）。状态变化时，通过调用 setState 方法通知 Flutter 框架，框架会重新构建 StatefulWidget 的 build 方法，从而更新 UI。
  • 状态是局部的，只在该 StatefulWidget 及其子树内有效。例如一个简单的计数器，点击按钮使计数器值增加，这种简单的状态变化就可由 StatefulWidget 自身管理。
• Provider：
  • Provider 是一个状态管理库，基于 InheritedWidget 实现。它通过依赖注入的方式，使状态可以在整个应用程序的不同层级之间共享。
  • 当 Provider 所提供的状态发生变化时，依赖该状态的 Widget 会自动重建。例如，应用中有一个全局的用户登录状态，多个页面都依赖这个状态来显示不同内容，Provider 就可很好地管理这个状态。

适用场景

• StatefulWidget：
  • 适用于简单的、局部的状态管理。比如单个页面内的 UI 交互状态，像按钮的点击状态、文本框的输入状态等。例如一个登录页面，用户名和密码输入框的输入状态管理，使用 StatefulWidget 就足够且简单直接。
• Provider：
  • 适用于跨组件、跨页面的状态共享和管理。当多个不同层级的 Widget 需要依赖同一个状态时，Provider 能高效地传递状态，避免状态提升的繁琐。例如电商应用中，购物车的商品列表状态，在商品详情页、购物车页面、结算页面等多个页面都需要使用，此时用 Provider 管理购物车状态就很合适。

功能模块举例

• 优先选择 StatefulWidget 的功能模块：
  • 单个页面内的表单输入模块，如注册页面的手机号、验证码输入等，每个输入框的状态管理使用 StatefulWidget 能很好地隔离和管理局部状态。
  • 单个页面内的简单动画切换模块，比如一个页面内的折叠面板，展开和收起状态的管理。
• 优先选择 Provider 的功能模块：
  • 全局用户信息模块，包括用户登录状态、用户基本资料等，应用内多个页面都可能用到这些信息，使用 Provider 便于状态共享。
  • 多页面联动的筛选条件模块，例如电商应用中商品筛选功能，筛选条件在不同商品列表页之间需要保持一致，用 Provider 管理筛选状态可实现多页面同步更新。