使用不同参数调用它时的有状态小部件更新，而不是更新？

Question

我刚开始学习flutter，我正在使用Stateful widget下面的代码是main.dart文件

void main() {
  runApp(App());
}

class App extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
      body: Home.Homescreen(HomeText: "default",), //initially setting text to default
      appBar: new AppBar(
        centerTitle: true,
        title: new Text("newApp",
            textDirection: TextDirection.ltr,
            style: TextStyle(fontSize:20 ,color: Colors.white)),
      ),
      bottomNavigationBar: new BottomNavigationBar(items: [
        new BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: new Text(
              "Home",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.face),
            title: new Text(
              "Profile",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.exit_to_app),
            title: new Text(
              "Exit",
              textDirection: TextDirection.ltr,
            )),
      ],onTap: (int item){
        if(item == 0){
          setState(() {
            Home.Homescreen(HomeText:'this is home'); /* this should change homescreen text but it still says default same for all the below as well*/
          });
        }
        else if(item == 1){
          setState(() {
            Home.Homescreen(HomeText:'this is proile');
          });

        }
        else if(item == 2){
          setState(() {
            Home.Homescreen(HomeText:'this is exit');
          });
        }
      },),
    ));
  }
}

在此调用了一个无状态小部件 'App' 并且在脚手架的 _AppState 中，主体被分配给一个无状态小部件 'HomeScreen' 在 BottomNavigationBar 下的 main 中导出为 Home 项目被分配一个 int对他们来说，点击后应该相应地更改 HomeText 但它不会更新，它在主屏幕上保持不变，只是说 "default" 这是它最初调用的内容，以下代码是 home_screen.dart 的

class Homescreen extends StatefulWidget{
  Homescreen({this.HomeText}); // init hometext
  String HomeText;
  @override
  _Homescreen createState() => _Homescreen();

}

class _Homescreen extends State<Homescreen>{

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Center(
      child: new Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
          new Text(
            widget.HomeText, // this is what should be updated when called
            textDirection: TextDirection.ltr,
            style: new TextStyle(fontSize: 30,color: Colors.black),
          )
        ],
      ),
    );
  }
}

我不明白为什么点击图标（bottomnavigationbaritems）时主文本不更新，我已经使用 debugprint 测试了这些值 return 0,1,2。所以，这至少是正确的。

Answer 1

试试下面的代码：

void main() {
  runApp(App());
}

class App extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App> {
  @override
  String homeText = "default";
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
      body: Home.Homescreen(HomeText: homeText,), //initially setting text to default
      appBar: new AppBar(
        centerTitle: true,
        title: new Text("newApp",
            textDirection: TextDirection.ltr,
            style: TextStyle(fontSize:20 ,color: Colors.white)),
      ),
      bottomNavigationBar: new BottomNavigationBar(items: [
        new BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: new Text(
              "Home",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.face),
            title: new Text(
              "Profile",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.exit_to_app),
            title: new Text(
              "Exit",
              textDirection: TextDirection.ltr,
            )),
      ],onTap: (int item){
        if(item == 0){
          setState(() {
            homeText = "this is home"; 
          });
        }
        else if(item == 1){
          setState(() {
            homeText = "this is profile";
          });

        }
        else if(item == 2){
          setState(() {
            homeText = "this is exit";
          });
        }
      },),
    ));
  }
}

您遇到的问题是您在调用 setState 时没有更改 body。当构建方法运行时，它总是有相同的 body。使用上面的代码，您更新 homeText 值，当构建方法运行时，homeText 有一个新值并且您的文本被更新。

Answer 2

class _AppState extends State<App> {
  String textToDisplay = 'default';
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
          body: Homescreen(HomeText: textToDisplay,), //initially setting text to default
          appBar: new AppBar(
            centerTitle: true,
            title: new Text("newApp",
                textDirection: TextDirection.ltr,
                style: TextStyle(fontSize:20 ,color: Colors.white)),
          ),
          bottomNavigationBar: new BottomNavigationBar(items: [
            new BottomNavigationBarItem(
                icon: Icon(Icons.home),
                title: new Text(
                  "Home",
                  textDirection: TextDirection.ltr,
                )),
            new BottomNavigationBarItem(
                icon: Icon(Icons.face),
                title: new Text(
                  "Profile",
                  textDirection: TextDirection.ltr,
                )),
            new BottomNavigationBarItem(
                icon: Icon(Icons.exit_to_app),
                title: new Text(
                  "Exit",
                  textDirection: TextDirection.ltr,
                )),
          ],onTap: (int item){
            if(item == 0){
              setState(() {
               textToDisplay= 'this is home'; /* this should change homescreen text but it still says default same for all the below as well*/
              });
            }
            else if(item == 1){
              setState(() {
               textToDisplay = 'this is proile';
              });

            }
            else if(item == 2){
              setState(() {
                textToDisplay = 'this is exit';
              });
            }
          },),
        ));
  }
}

注意：不要将 HomeWidget 导出为主页，只需导入它所在的文件并使用简单的 class 名称

另外看看一些flutter的基础教程和文档here and here先熟悉一下flutter系统

Answer 3

尝试传递一个密钥，我相信它应该对你有帮助：

Home.Homescreen(HomeText:'this is proile', key: key: ValueKey('this is proile') );

添加密钥并将其传递给主屏幕中的超级用户：

class Homescreen extends StatefulWidget{
  Homescreen({Key key, this.HomeText}) : super(key: key); // init hometext
  String HomeText;

  @override
  _Homescreen createState() => _Homescreen();

}

key 应该是独一无二的，让它知道它应该更新。这里有几个关于有状态小部件和键的链接：

https://api.flutter.dev/flutter/widgets/StatefulWidget-class.html

https://www.youtube.com/watch?v=kn0EOS-ZiIc&app=desktop

https://medium.com/@ayushpguptaapg/using-keys-in-flutter-1c5fb586b2a5

使用不同参数调用它时的有状态小部件更新，而不是更新？

Stateful Widget updation on calling it with different parameters, not updating?

android

flutter

flutter-layout

setstate

statelesswidget