【问题标题】:what does it mean when we see people calling widget in dart?当我们看到人们在 dart 中调用小部件时,这意味着什么?
【发布时间】:2021-05-26 04:01:17
【问题描述】:

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

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

例如下面的代码,(高亮部分是我的困惑)


class _MyOwnClassState extends State<MyOwnClass> {

  @override
  Widget build(BuildContext context) {

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

}

【问题讨论】:

    标签: flutter widget


    【解决方案1】:

    在flutter的StatefulWidget中,我们有如下架构。

    你有一个这样的StatefulWidget

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

    你的StatefulWidget 有一个State 类,就像这样,

    class _MyOwnClassState extends State<MyOwnClass> {
    }
    

    现在,State 类用于容纳倾向于更改的变量,以便重建您的 UI。

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

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

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

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

    例如,

    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 还有更多内部实例成员,您可以使用widget 变量在State 类内部访问这些成员。

    【讨论】:

    • 这很好解释
    • 很高兴帮助@hose。请考虑接受我的回答。谢谢:)
    • 我可以知道如何执行此操作吗?我想这样做。另外,我可以知道在哪里可以查看更多关于小部件变量的信息吗?由于我在任何地方都看不到它,所以有时我可能会发现很难掌握它。
    • 您好,请检查此处以接受答案stackoverflow.com/help/someone-answers。对于 widget 变量,只需 ctrl + 单击代码中的 widget。它会将您重定向到文档
    【解决方案2】:

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

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

    每当调用setState() 方法时,框架都会一次又一次地调用build() methodsetState() 方法通知框架这个对象的内部状态已经改变,应该重建它。假设我们改变StatefulWidget中文本的值,那么我们需要调用setState()

    【讨论】:

      【解决方案3】:

      编辑正如 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)**),
            ),
          );
        }
      
      }
      

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

      【讨论】:

      • 这似乎在很大程度上偏离了主要观点,OP想了解当有些人打电话给widget.something是什么意思。然而,这个答案似乎在解释why create extra functions like makeWidgetChildren。这不是 OP 所指的。
      • 是的,你是对的;我又读了一遍他的问题。
      猜你喜欢
      • 2013-08-07
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2023-04-07
      • 2018-02-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多