当我们看到人们在 dart 中调用 widget 时，这意味着什么？

编程问答 2022-04-30

问题描述

我见过很多人在调用小部件。代码里面的东西。

我可以知道它实际上在做什么吗？

例如下面的代码，（突出显示的部分是我的困惑）

class _MyOwnClassstate extends State<MyOwnClass> {

  @override
  Widget build(BuildContext context) {

    return ListTile(
      title: Container(
        child: Column(children: makeWidgetChildren(**widget.jsonObject)**),),);
  }

}

解决方法

在 Flutter 的 StatefulWidget 中，我们有以下架构。

你有一个这样的StatefulWidget，

class MyOwnClass extends StatefulWidget {
  State createState () => _MyOwnClassState();
}

而且你的State有一个StatefulWidget类，就像这样，

class _MyOwnClassState extends State<MyOwnClass> {
}

现在，State 类旨在容纳可能会发生变化的变量，以便重建您的 UI。

因此您可以在您的 State 中包含可以使用 setState 更新的变量。

但是如果您有一些不会更改的数据并且您想避免将它们放入 State 类中怎么办。

这就是您的 StatefulWidget 发挥作用的地方。

您可以在 MyOwnClass 中存储变量，widget 类中的 State 变量为您提供了访问它们的方法。

例如

class MyOwnClass extends StatefulWidget {
  int numberThatDoesntChange = 1;

  State createState () => _MyOwnClassState();
}

您可以像这样在 State 类中访问它们，

class _MyOwnClassState extends State<MyOwnClass> {
  Widget build(BuildContext context) {
    return Text('$widget.numberThatDoesntChange');
  }
}

除此之外，您的 StatefulWidget 还有更多内部实例成员，您可以使用 State 变量在 widget 类内部访问这些成员。

,

widget 指的是在屏幕上呈现的实际视图。它扩展了 Flutter 框架的 StatefulWidget 类并覆盖了 createState() 方法。 createState() 方法用于创建状态类的实例。我们将调查createState()。

state class 用于维护小部件的状态，以便它可以再次重建。它扩展了 Flutter 框架的 State 类并覆盖了 build method。

每当调用 build() method 方法时，框架都会一次又一次地调用 setState()。 setState() 方法通知框架此对象的内部状态已更改，应重新构建。假设我们更改了 StatefulWidget 中文本的值，那么我们需要调用 setState()。

,

编辑 正如 Nisanth 在他的评论中指出的那样 - 我完全错过了你的问题；请忽略以下....

让我试试我的答案，我认为其他人没有理解你的意思。

在您的示例中，Column(children: x) 需要一个小部件列表。

您有两种选择 - 或者直接提供此列表：

class _MyOwnClassState extends State<MyOwnClass> {

  @override
  Widget build(BuildContext context) {

    return ListTile(
      title: Container(
        child: Column(children: <Widget>[SomeWidget()]),),);
  }

}

或者，如果您有更复杂的代码来生成小部件 - 基于输入参数，或者您多次生成相同的小部件并且您想避免代码重复 - 您可以创建单独的函数来完成这项工作。>

类似于：

class _MyOwnClassState extends State<MyOwnClass> {

  List<Widget> makeWidgetChildren(int param) {
     /*
    some very complex logic here
    /*
    if (param>3 && param<4) {
        return List<Widget>.generate(4,(index)=>SomeWidget1(index));
    } else {
        return <Widget>[Center()];
    }
  }

  @override
  Widget build(BuildContext context) {

    return ListTile(
      title: Container(
        child: Column(children: makeWidgetChildren(**widget.jsonObject)**),);
  }

}

所以基本上，只是为了让代码更好看；并避免在构建函数中一遍又一遍地重复代码。

widget