Question

我在抽屉菜单中有一个AppBar()，该菜单调用了我应用中的所有页面，（我目前正在使用此依赖项-https://pub.dev/packages/drawerbehavior）

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

class NavigatorMenu extends StatefulWidget {
  @override
  _NavigatorMenuState createState() => _NavigatorMenuState();
}

class _NavigatorMenuState extends State<NavigatorMenu> {
   int selectedNavigatorMenuItemId;
      DrawerScaffoldController controller = DrawerScaffoldController();
     
      @override
      Widget build(BuildContext context) {
        return DrawerScaffold(
          controller: controller,
          appBar: AppBar
            actions: <Widget>[
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      Text(pointsText.toString()),
                    ],
                  ),
                ],
              ),
            ],
          drawers: [
            SideDrawer(
              percentage: 0.6,
              menu: menu,
              selectedItemId: selectedNavigatorMenuItemId,
              onMenuItemSelected: (itemId) {
                setState(() {
                  selectedNavigatorMenuItemId = itemId;
                });
              },
            ),
          ],
          builder: (context, id) => IndexedStack(index: id, children: <Widget>[
            Home(),
          ]),
        );
      }
}

我想更新pointsText中全局定义的Home()，但是由于AppBar是在另一个StatefulWidget中定义的，因此不会更新我的UI应用程序。

int pointsText;

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: ListView(
            children: <Widget>[
              RaisedButton(
                onPressed: () {
                  setState(() {
                    pointsText++;
                  });
                },
                child: Text('Update UI'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

在_NavigatorMenuState中声明从Home Widget接收值的函数

  int appBarValue;
  void updateAppBar(int value) {
                setState(() {
                      appBarValue = value;
                  });
  }

将此方法传递给主窗口小部件

Home(updateAppBar),

在AppBar文本中使用appBarValue值

Text(appBarValue.toString()),

最后，从主屏幕进行回调。

int pointsText;

class Home extends StatefulWidget {
  final _updateAppBar;
  Home(this._updateAppBar);


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

class _HomeState extends State<Home> {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: ListView(
            children: <Widget>[
              RaisedButton(
                onPressed: () {
                  setState(() {
                    pointsText++;
                    widget._updateAppBar(pointsText);
                  });
                },
                child: Text('Update UI'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

如何使用setState（）将UI从一个有状态的小部件更新到另一个有状态的小部件

1 个答案: