StatefulWidget和StatelessWidget简介

在Flutter中，Widget是构建UI的基本元素。StatefulWidget是一种Widget，它有一个可变状态(State)，可以在运行时根据需要更新并重新构建UI。StatelessWidget则是没有可变状态的Widget，它的UI构建只能在初始化时进行一次。

具体来说，StatefulWidget和StatelessWidget的区别在于：

  • StatefulWidget是一个有状态的Widget，它有一个State对象来存储其可变状态，而StatelessWidget是一个无状态的Widget，它没有可变状态。
  • StatefulWidget的可变状态可以在运行时进行更改，而StatelessWidget的UI构建只能在初始化时进行一次，无法进行更改。
  • StatefulWidget通过State对象来管理其状态，而StatelessWidget没有State对象。

当我们需要在UI中使用可变状态时，通常会使用StatefulWidget。例如，当我们需要根据用户输入或某些条件来动态更改UI时，可以使用StatefulWidget来管理UI的状态。而当UI的构建不需要依赖于可变状态时，可以使用StatelessWidget来构建UI，因为它更轻量级，不需要管理状态。

总之，在使用StatefulWidget和StatelessWidget时，我们需要根据UI的需求来决定使用哪一个。如果我们需要在UI中使用可变状态，那么就应该使用StatefulWidget，否则使用StatelessWidget。

例子

我们一般会按下面这样来创建一个自己的widget，来实现UI可以根据需求刷新

class SettingsPage extends StatefulWidget {
  const SettingsPage({Key? key}) : super(key: key);

  @override
  _SettingsPageState createState() => _SettingsPageState();
}

class _SettingsPageState extends State<SettingsPage> {
}

这段代码定义了一个名为SettingsPage的StatefulWidget。它有一个可选的Key参数，用于标识Widget。它还重写了createState()方法，用于创建一个_SettingsPageState对象，这个对象会负责管理SettingsPage的可变状态，如需要更新UI时，会调用setState()方法来通知Flutter框架重新构建UI。

_SettingsPageState是一个SettingsPage的State对象，它实现了StatefulWidget的核心功能，即管理可变状态并响应UI更新。它通常会包含一些成员变量来存储状态，如用户选择的选项，文本框中输入的文本等。当状态发生变化时，_SettingsPageState会调用setState()方法，通知Flutter框架重新构建UI。

这段代码定义了一个有状态的SettingsPage Widget，它有一个_SettingsPageState对象来管理其可变状态。在使用这个Widget时，我们可以通过setState()方法来更新状态，并通知Flutter框架重新构建UI。

注意

需要注意的是，使用StatefulWidget需要谨慎，因为它可能会导致状态管理复杂，性能下降等问题。因此，我们应该尽量避免不必要的状态管理，只在必要时使用StatefulWidget来管理状态。