Question

这是获取登录响应的代码。如果出现错误，我想显示一个“警告”对话框，提示登录期间发生错误。

Future<String> login(String username, String password) async {
    Map<String, dynamic> params = {
       'username': username,
       'password': password,
    };

    final response = await http.post('apiurl', body: params);

    if (response.statusCode != 200)
       throw Exception(response.body);

    return response.body;
}

我正在添加从 login 进行调用的代码。 _loginController 中有一个待办事项，我想在其中显示显示错误的警报对话框。

class LoginWidgetState extends State<LoginWidget> {
  var _usernameController = new TextEditingController();

  var _passwordController = new TextEditingController();

  void _loginButtonClickHandler() {
    var username = _usernameController.text;
    var password = _passwordController.text;

    login(username, password).then((response) {

    }).catchError((e) {
      //TODO : show an Alert Here
    });
  }

  @override
  Widget build(BuildContext context) {
    var container = Center(
      child: Container(
    child: Column(
      children: <Widget>[
        TextField(
          decoration: InputDecoration(
            hintText: "username",
          ),
          controller: _usernameController,
        ),
        TextField(
          obscureText: true,
          decoration: InputDecoration(hintText: "password"),
          controller: _passwordController,
        ),
        RawMaterialButton(
          onPressed: _loginButtonClickHandler,
          child: Text("Login"),
        )
       ],
     ),
    ),
   );

   return container;
  }

}

Answer 1

这将为您提供帮助！

Future<String> login(String username, String password) async {
Map<String, dynamic> params = {
   'username': username,
   'password': password,
};

final response = await http.post('apiurl', body: params);

if (response.statusCode != 200)
{
  throw Exception(response.body);
}
else 
{
  showWhateverFunction();
}
return response.body;

}

Answer 2

请参阅here以显示对话框。

将context发送到_loginButtonClickHandler，您就完成了。干杯

Answer 3

您可以为此使用RFlutter Alert库。它是Flutter的易于自定义且易于使用的警报/弹出对话框库。希望对您有帮助。

带有RFlutter警报的警报示例：

Alert(context: context, title: "RFLUTTER", desc: "Flutter is awesome.").show();

*我是RFlutter Alert的开发人员之一。

Answer 4

为接受的答案提供更多背景信息...

如果您进行this之类的远程API调用：

login(username, password).then((response) {

}).catchError((e) {
  //TODO : show an Alert Here
});

然后您可以用此替换TODO（如果您通过单击按钮调用它）：

_showAlertDialog(context);

或者这（如果您是从build()方法或initState()中调用的：

WidgetsBinding.instance.addPostFrameCallback((_) => _showAlertDialog(context));

方法定义为

void _showNewVersionAvailableDialog(BuildContext context) {
  final alert = AlertDialog(
    title: Text("Error"),
    content: Text("There was an error during login."),
    actions: [FlatButton(child: Text("OK"), onPressed: () {})],
  );

  showDialog(
    context: context,
    builder: (BuildContext context) {
      return alert;
    },
  );
}

注释

您需要引用BuildContext。
有关addPostFrameCallback的更多信息，请阅读this article。

Flutter：异步Api调用后显示警报对话框

4 个答案:

注释