时间戳

首页 > 解决方案 > 在 Flutter 中的两个类的方法中使用 setState 的最佳方法

flutter - 在 Flutter 中的两个类的方法中使用 setState 的最佳方法

问题描述

我有一个疑问，我是 Flutter 的新手，我想知道是否有更好的方法来做我想做的事，请参阅下一个代码示例。

这是我的屏幕，我要上课，一个是设备高度小于 800 的时候，另一个是更高的时候

class MyPageExample extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    var screenSize = MediaQuery.of(context).size;
    
    return Scaffold(
      body: SafeArea(
        child: screenSize.height > 800
                ? SignupLarge()
                : SignupSmall()
      )
    );
  }
}

这是我的两个 StatefulWidget

class SignupLarge extends StatefulWidget {
  const SignupLarge({ Key? key }) : super(key: key);

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

class _SingupLargeState extends State<SignupLarge> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Wome widgets...
        ElevatedButton(
          onPressed: () => signupToFirebase(),
          child: Text('Click me')
        )
      ],
    );
  }
}

class SignupSmall extends StatefulWidget {
  const SignupSmall({ Key? key }) : super(key: key);

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

class _SignupSmallState extends State<SignupSmall> {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        // Wome widgets...
        ElevatedButton(
          onPressed: () => signupToFirebase(),
          child: Text('Click me')
        )
      ],
    );
  }
}


signupToFirebase(){
  // I need to use setState here to show the loading widget
  // await Firebase.instance.signupWithEmailAndPassword... 
  // I need to use setState here to hide the loading widget
}

我想要做的是使用 setState 在我的类中使用该方法，实际上我不能，因为我的方法不在我的类中，但如果我把我的方法放在里面，我不能在两个类中使用相同的方法。

上面的代码只是我的代码外观的一个示例，我试图在用户注册时显示加载。

有人知道使用这两个类为我的方法使用 setState 的正确方法吗？

标签： flutterflutter-layout

解决方案

您可以为该函数提供另一个函数以供其调用。

void signupToFirebase(void Function() whenDone) {
  //...
  whenDone();
}

...
  // caller
  signupToFirebase(() {
    setState(() {

    });
  });
...

或者更好的是，如果你想做的是在它完成后采取行动，你可以让该函数返回一个 Future。

Future<void> signupToFirebase() {
  await FirebaseAuth.instance... signup() kind of function that returns a Future
}

...
  // caller
  await signupToFirebase();
  setState(() {

  });
...

推荐阅读