Flutter – 有状态与无状态小部件

应用程序的状态可以非常简单地定义为应用程序运行时应用程序内存中存在的任何内容。这包括维护应用程序 UI 的所有小部件，包括按钮、文本字体、图标、动画等。现在我们知道了这些状态是什么，让我们直接进入我们的主要主题，即这些有状态和无状态小部件是什么以及它们彼此有何不同。

状态

The State is the information that can be read synchronously when the widget is built and might change during the lifetime of the widget.

换句话说，小部件的状态是其属性(参数)在其创建时(当小部件在屏幕上绘制时)所维持的对象的数据。状态也可以在使用时更改，例如单击CheckBox小部件时，复选框上会出现一个勾号。

无状态小部件：一旦构建后状态就不能改变的小部件称为无状态小部件。这些小部件一旦被构建就是不可变的，即变量、图标、按钮或检索数据的任何变化都不能改变应用程序的状态。以下是无状态小部件的基本结构。无状态小部件覆盖build () 方法并返回一个小部件。 例如，我们使用Text或Icon是我们的flutter应用程序，其中小部件的状态在运行时不会改变。当 UI 依赖于对象本身的信息时使用它。其他示例可以是Text 、 RaisedButton 、 IconButtons 。

Dart

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

那么让我们看看这个小代码片段告诉我们什么。无状态小部件的名称是 MyApp，它从runApp()调用并扩展了无状态小部件。在这个 MyApp 中，一个构建函数被覆盖，并将 BuildContext 作为参数。此 BuildContext 对每个小部件都是唯一的，因为它用于在小部件树中定位小部件。

注意： Flutter应用程序的小部件以小部件树的形式显示，我们连接父小部件和子小部件以显示它们之间的关系，然后组合形成应用程序的状态。

build函数包含一个容器，它也是Flutter 的一个小部件，我们将在其中设计应用程序的 UI。在无状态小部件中，构建函数仅被调用一次，从而生成屏幕的 UI。

有状态的小部件：一旦构建，状态就可以改变的小部件称为有状态的小部件。这些状态是可变的，可以在其生命周期中多次更改。这只是意味着应用程序的状态可以通过不同的变量、输入、数据集多次更改。以下是有状态小部件的基本结构。有状态小部件覆盖createState () 并返回一个State 。当 UI 可以动态更改时使用它。一些示例可以是CheckBox 、 RadioButton 、 Form 、 TextField 。

继承“Stateful Widget”的类是不可变的。但是 State 是可变的，当用户与其交互时，它会在运行时发生变化。

Dart

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}
 
class _MyAppState extends State {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

让我们看看这段代码片段中有什么。有状态小部件的名称是 MyApp，它从runApp()调用并扩展了有状态小部件。在 MyApp 类中，我们覆盖了创建状态函数。此 createState()函数用于在树中的给定位置为此小部件创建可变状态。此方法返回受尊重状态子类的实例。另一个类是 _MyAppState 扩展状态，它管理小部件中的所有更改。在这个类中，构建函数被覆盖，它以 BuildContext 作为参数。这个构建函数返回一个小部件，我们在其中设计应用程序的 UI。由于它是一个有状态的小部件，因此多次调用 build函数，这将再次创建具有所有更改的整个 UI。当您描述的用户界面部分不依赖于配置信息和 BuildContext 以外的任何内容时，无状态小部件很有用，而当您描述的用户界面部分可以动态更改时，有状态小部件很有用。