Flutter 颤振/飞镖：我的小部件树中可以有多个状态为的小部件吗？

我一直在想，为什么我必须在树中“提升”某个小部件的状态，以反映小部件UI中的变化。。 我不能简单地拥有多个有状态的小部件吗？例如，将树下最低状态的小部件导入到我的顶级小部件中，从那里我可以调用小部件的某个方法来触发其setState（）方法，并更新DOM树中与我的小部件相关的部分吗

其次，我将不得不将我的属性和其他重要部分从较低的小部件向上移动到较高状态的小部件中，冒着在某个时候用不相关的函数和属性扰乱该类的风险，在我看来，React通过在合适的时候向下传递方法回调来更好地解决这个问题

在我的Flitter应用程序中，最高级别是否总是只有一个有状态的小部件？

• 父母没有访问子部件/状态的权限，只有相反的方式。因此，您不能“将树下最低状态的小部件导入我的顶级小部件”

• 当您想要在小部件树的不同分支之间共享该状态时，您只需“提升状态”。然后子级可以查找父级并访问共享状态

• 不要害怕

  StatefulWidget

  ——您可以根据需要使用任意数量的组件

• 研究颤振状态管理解决方案，这些解决方案的存在完全是为了保持事物分离（ChangeNotifier、Provider、BLOC、Redux等）

---

我的小部件树中是否可以有多个状态为的小部件

答案是，是的，您可以在小部件中创建多个

StatefulWidget

。您还可以使用

function（yourcallback）

从最低的

StatefulWidget

创建

callback

函数。在我看来，flatter还支持组件基础模型，并尽可能动态地定制我们自己的小部件

例如：

子元件 子部件有它的状态

class Child extends StatefulWidget {
  final int counter;
  final Function(int childCounter) callback; //here is your callback
  const Child({
    Key key,
    this.counter,
    this.callback,
  }) : super(key: key);
  @override
  _ChildState createState() => _ChildState();
}

class _ChildState extends State<Child> {
  String _childState = '';

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.green[400],
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Text("Child"),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              IconButton(
                  icon: Icon(Icons.exposure_minus_1_rounded),
                  onPressed: () {
                    this.widget.callback(this.widget.counter - 1); //here is your callback
                    setState(() {
                      _childState = "minus one";
                    });
                  }),
              IconButton(
                  icon: Icon(Icons.plus_one_rounded),
                  onPressed: () {
                    this.widget.callback(this.widget.counter + 1); //here is your callback
                    setState(() {
                      _childState = "plus one";
                    });
                  })
            ],
          ),
          Text(_childState)
        ],
      ),
    );
  }
}

类子级扩展StatefulWidget{
最终整数计数器；
最终函数（int childCounter）回调；//这是您的回调
康斯特儿童({
关键点，
这个柜台，
这个.回调,，
})：super（key:key）；
@凌驾
_ChildState createState（）=>\u ChildState（）；
}
类_ChildState扩展了状态{
字符串_childState=''；
@凌驾
小部件构建（构建上下文）{
返回容器(
颜色：颜色。绿色[400]，
子：列(
crossAxisAlignment:crossAxisAlignment.center，
儿童：[
文本（“儿童”），
划船(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
图标按钮(
图标：图标（图标。曝光度减去1四舍五入），
已按下：（）{
this.widget.callback（this.widget.counter-1）；//这是您的回调
设置状态（）{
_childState=“负一”；
});
}),
图标按钮(
图标：图标（图标加一个四舍五入），
已按下：（）{
this.widget.callback（this.widget.counter+1）；//这是您的回调
设置状态（）{
_childState=“加一”；
});
})
],
),
文本（_childState）
],
),
);
}
}

父窗口小部件 父对象从子对象获取回调

class Parent extends StatefulWidget {
  @override
  _ParentState createState() => _ParentState();
}

class _ParentState extends State<Parent> {
  int _counter = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Multiple State"),
      ),
      body: Container(
        child: Column(
          children: [
            Child(
              counter: _counter,
              callback: (childCounter) { //here is callback from the child
                print(childCounter);
                setState(() {
                  _counter = childCounter;
                });
              },
            ),
            Text("Parent"),
            Center(
              child: Text(_counter.toString()),
            )
          ],
        ),
      ),
    );
  }
}

类父级扩展StatefulWidget{
@凌驾
_ParentState createState（）=>\u ParentState（）；
}
类_ParentState扩展了状态{
int _计数器=0；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“多状态”），
),
主体：容器(
子：列(
儿童：[
孩子(
柜台:"柜台,，
callback：（childCounter）{//这里是来自子对象的回调
打印（儿童计数器）；
设置状态（）{
_计数器=儿童计数器；
});
},
),
文本（“父项”），
居中(
子项：文本（_counter.toString（）），
)
],
),
),
);
}
}

从其父级更改子级状态的步骤

---

您可以使用

didUpdateWidget（）

，这就是为什么颤振中有如此多的状态管理解决方案变体的原因。您是否尝试创建具有自己状态的多个statefulwidget，并且希望每个小部件都进行回调？