Question

请问您对此的帮助。

我下面的示例代码旨在从子窗口小部件更新父窗口小部件的状态，同时还更新子窗口小部件的状态。父小部件的文本值会更新，同时还会更改子小部件按钮的颜色。

import 'package:flutter/material.dart';

void main() => runApp(AppIndex());

class AppIndex extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: ParentWidget());
  }
}

class ParentWidget extends StatefulWidget {
  @override
  _ParentWidgetState createState() => _ParentWidgetState();
}

class _ParentWidgetState extends State<ParentWidget> {
  String _textValue = 'Old Value';

callback(newValue){
  setState(() {
    _textValue = newValue;
  });
}

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Text(_textValue),
        ChildWidget(),
      ],
    );
  }
}

class ChildWidget extends StatefulWidget {
  String textValue;
  Function callback;

  ChildWidget({this.textValue, this.callback});

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

class _ChildWidgetState extends State<ChildWidget> {
  bool buttonState = false;

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      color: buttonState == true ? Colors.greenAccent : Colors.redAccent,
      child: Text('Update State'),
      onPressed: () {
        setState(() {
          if (buttonState == false) {
            buttonState = true;
          } else if (buttonState == true) {
            buttonState = false;
          }
        });

        widget.callback('New Value');
      },
    );
  }
}

到目前为止，该功能只能更新子级小部件的颜色/状态，但是，父级小部件似乎并没有更新其状态。我的原始代码实际上是从中获取的，实际上仅更新了父级状态，而不是父子级（相同的概念和关注点）。

上面的示例代码是我在这里进行询问之前的初步研究结果的衍生产品。

我认为我的代码结构一定有问题，或者基于我的编写方法，Flutter的架构不可能做到这一点。如果可能的话，您能给我有关行为相同的建议吗？（更新父子状态）

对不起，我是这种编程和体系结构的新手。

Answer 1

欢迎来到Flutter！似乎您没有将回调传递给子窗口小部件。实例化ChildWidget时，您应该执行new ChildWidget(callback: this.callback);除此之外，在我扫描之后，我没有发现您的代码有任何问题，看起来您已正确设置了代码。您还需要将该回调函数传播到子窗口小部件中的build方法。因此，现在您在有状态窗口小部件中定义了Function callback，但是在您的State<ChildWidget>中，您需要再次定义它，并将值从有状态窗口小部件传递到{ {1}}方法。

此外，值得注意的是，您应尽最大努力避免使用createState类型，因为它实际上并未提供有关函数将返回什么或将其用作参数的信息。为此，Dart使用Function关键字。例如，对于使用日期字符串并返回日期的函数（考虑到Darts对日期的出色内置支持，这是一个有些人为的例子，可以这样做）：

typedef

然后，您可以在课堂上使用typedef Date StringToDateParser(String datestring);作为类型。

StringToDateParser

如何在其子控件中更新父控件的状态，同时又在Flutter中更新子控件的状态？

1 个答案: