flutter - 如何通过另一个类的方法设置状态

Question

使用 Flutter 并尝试将 Widget 移出到另一个类以保持模块化。 问题是其中一个内部 Widget 有一个 setState。但是当我将它移到另一个类时，它是无效的，因为它不是有状态的。最初想到传入一个函数并将其替换为 setState 函数本身，但这似乎不起作用。我该如何解决这个问题？

当前方法运行良好。我计划将第 6 行(child:Center)中的所有内容移到另一个类，因为这将通过 PageView 重复。将这一页滑动到下一页，每页看起来都一样，只有文字发生了变化。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.tealAccent,
      body: SafeArea(
        child: Center(
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Text(
                  "Did you hear about the claustrophobic astronaut?",
                  style: TextStyle(
                    fontSize: 20,
                  ),
                ),
                Text(
                  "He just needed a little space.",
                  style: TextStyle(
                    fontSize: 20,
                  ),
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: <Widget>[
                    GestureDetector(
                      child: Icon(heartStatus),
                      onTap: () {
                        setState(() {
                          if (heartStatus == FontAwesomeIcons.heart) {
                            heartStatus = FontAwesomeIcons.solidHeart;
                          } else {
                            heartStatus = FontAwesomeIcons.heart;
                          }
                        });
                      },
                    ),
                    GestureDetector(
                      child: Icon(FontAwesomeIcons.shareAlt),
                      onTap: (){
                        print('shared');
                      },
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

这是在将它移到另一个类之后，因为设置状态在这里无效，所以无法正常工作。在这里传入函数会抛出错误 -> 不必要的语句

Widget getPageData(Function function){
  IconData heartStatus = FontAwesomeIcons.heart;

  return Center(
    child: Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Text(
            "Did you hear about the claustrophobic astronaut?",
            style: TextStyle(
              fontSize: 20,
            ),
          ),
          Text(
            "He just needed a little space.",
            style: TextStyle(
              fontSize: 20,
            ),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              GestureDetector(
                child: Icon(heartStatus),
                onTap: () {
                  setState(() {
                    //tried passing in function here
                    if (heartStatus == FontAwesomeIcons.heart) {
                      heartStatus = FontAwesomeIcons.solidHeart;
                    } else {
                      heartStatus = FontAwesomeIcons.heart;
                    }
                  });
                },
              ),
              GestureDetector(
                child: Icon(FontAwesomeIcons.shareAlt),
                onTap: (){
                  print('shared');
                },
              ),
            ],
          ),
        ],
      ),
    ),
  );
}

Answer 1

你可以改变你的函数:

Widget getPageData(Function function){...}

到自定义小部件

class CustomizeWidget extend StatefulWidget{

}
class _CustomizeWidgetState extend State<StatefulWidget>{
   /// in the build function, you can call setState
}