颤振状态管理

在本节中，我们将讨论状态管理以及如何在Flutter中处理状态管理。我们知道在Flutter中，一切都是小部件。小部件可以分为两类，一类是无状态小部件，另一类是有状态小部件。无状态窗口小部件没有任何内部状态。这意味着一旦构建完成，我们将无法对其进行更改或修改，除非它们再次被初始化。另一方面，有状态窗口小部件是动态的并且具有状态。这意味着我们可以在其整个生命周期内轻松修改它，而无需再次对其进行初始化。

什么是国家?

状态是在构建窗口小部件时可以读取的信息，并且可能会在应用程序的整个生命周期内进行更改或修改。如果要更改窗口小部件，则需要更新状态对象，这可以通过使用有状态窗口小部件可用的setState()函数来完成。 setState()函数使我们可以设置触发UI重绘的状态对象的属性。

状态管理是应用程序生命周期中最流行且必要的过程之一。根据官方文档，Flutter是声明性的。这意味着Flutter通过反映您应用的当前状态来构建其UI。下图更清楚地说明了您可以在哪里从应用程序状态构建UI。

让我们以一个简单的例子来了解状态管理的概念。假设您已在应用程序中创建了客户或产品列表。现在，假设您已在该列表中动态添加了新客户或产品。然后，需要刷新列表以查看新添加到记录中的项目。因此，无论何时添加新项目，都需要刷新列表。这种类型的编程需要状态管理来处理这种情况以提高性能。这是因为每次您进行更改或更新时，状态都会刷新。

在Flutter中，状态管理分为两种概念类型，如下所示：

• 暂时状态
• 应用状态

暂时状态

此状态也称为UI状态或本地状态。它是与特定窗口小部件相关的一种状态，或者可以说它是包含在单个窗口小部件中的状态。在这种状态下，您无需使用状态管理技术。此状态的常见示例是“文本字段” 。

例

class MyHomepage extends StatefulWidget {
  @override
  MyHomepageState createState() => MyHomepageState();
}

class MyHomepageState extends State {
  String _name = "Peter";

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
        child: Text(_name),
        onPressed: () {
           setState(() {
              _name = _name == "Peter" ? "John" : "Peter";
           });
         },
      );
  }
}

在上面的示例中， _name是短暂状态。在这里，只有StatefulWidget类中的setState()函数可以访问_name。 build方法调用setState()函数，该函数对状态变量进行修改。执行此方法时，小部件对象将替换为新的小部件对象，该对象将提供修改后的变量值。

应用状态

它与短暂状态不同。这是一种状态，我们希望在应用程序的各个部分之间共享，并且希望保持用户会话之间的状态。因此，这种类型的状态可以全局使用。有时也称为应用程序状态或共享状态。此状态的一些示例是用户首选项，登录信息，社交网络应用程序中的通知，电子商务应用程序中的购物车，新闻应用程序中文章的已读/未读状态等。

下图更恰当地说明了短暂状态和应用程序状态之间的区别。

可以通过使用提供程序包来学习应用程序状态管理的最简单示例。提供者的状态管理很容易理解，并且需要更少的编码。提供者是第三方库。在这里，我们需要了解使用此库的三个主要概念。

• 变更通知者
• ChangeNotifierProvider
• 消费者

变更通知者

ChangeNotifier是一个简单的类，它向其侦听器提供更改通知。对于少量的听众来说，它很容易理解，实现和优化。它用于侦听器观察更改的模型。在此，我们仅使用notifyListener()方法来通知侦听器。

例如，让我们基于ChangeNotifier定义一个模型。在此模型中，使用ChangeNotifier扩展了Counter ，该计数器用于在我们调用notifyListeners()时通知其侦听器。这是唯一需要在ChangeNotifier模型中实现的方法。在此示例中，我们声明了两个函数： increment和decrement，用于增加和减少值。每当模型更改时，我们都可以以可能更改应用程序UI的方式调用notifyListeners()方法。

import 'package:flutter/material.dart';

class Counter with ChangeNotifier {
  int _counter;

  Counter(this._counter);

  getCounter() => _counter;
  setCounter(int counter) => _counter = counter;

  void increment() {
    _counter++;
    notifyListeners();
  }

  void decrement() {
    _counter--;
    notifyListeners();
  }
}

ChangeNotifierProvider

ChangeNotifierProvider是为其后代提供ChangeNotifier实例的窗口小部件。它来自提供程序包。以下代码段有助于理解ChangeNotifierProvider的概念。

在这里，我们定义了一个构建器，该构建器将创建Counter模型的新实例。除非有必要，否则ChangeNotifierProvider不会重建Counter。当不再需要该实例时，它还将自动在Counter模型上调用dispose()方法。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.indigo,
      ),
      home: ChangeNotifierProvider(
        builder: (_) => CounterModel(),
        child: CounterView(),
      ),
    );
  }
}

如果需要提供多个类，则可以使用MultiProvider。 MultiProvider是其范围内使用的所有不同Provider的列表。如果不使用它，我们将不得不将我们的提供者嵌套在一起，而后者又是另一个的孩子。我们可以从下面的代码中了解这一点。

void main() {
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(builder: (context) => Counter()),
        Provider(builder: (context) => SomeOtherClass()),
      ],
      child: MyApp(),
    ),
  );
}

消费者

这是一种提供者，不做任何花哨的工作。它只是在新的小部件中调用提供程序，并将其构建实现委派给构建器。以下代码对其进行了更清晰的说明。

return Consumer(
  builder: (context, count, child) {
    return Text("Total price: ${count.total}");
  },
);

在上面的示例中，您可以看到Consumer小部件仅需要一个builder函数，只要ChangeNotifier更改，该函数就会被调用。 builder函数包含三个参数，分别是上下文，计数和子代。第一个参数，上下文，包含在每个build()方法中。第二个参数是ChangeNotifier的实例，第三个参数是用于优化的子级。最好将使用者小部件放在树中尽可能深的位置。