flutter - 调用 notifyListeners() 时对话框状态不更新

Question

我正在使用 providers在我的 flutter 应用程序中管理状态。我有一个对话，最初应该显示 CircularProgressBar，然后再显示一些内容。当我需要 CircularProgressBar 更改内容时，我正在调用 notifyListeners() ，但这似乎没有任何作用。这是我的一些代码，如果您需要再看，请告诉我。

调用显示对话的方法:

displayDialog() {
  return showDialog(
    context: context,
    barrierDismissible: false,
    builder: (BuildContext context) {
      return ChangeNotifierProvider<CreateAccountProvider>(
        builder: (_) => CreateAccountProvider(),
        child: CreateNewUserDialog(),
      );
    },
  );
}

final createAccountButton = Material(
  elevation: 5.0,
  color: Colors.lightGreen,
  child: MaterialButton(
    minWidth: MediaQuery.of(context).size.width,
    padding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
    onPressed: () {
      createAccountProvider.createAccountClicked(context);
      displayDialog();
    },
    child: Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Icon(
          Icons.play_arrow,
          color: Colors.white,
        ),
        SizedBox(
          width: 5,
        ),
        Text(
          "Create an account",
          textAlign: TextAlign.center,
          style: TextStyle(color: Colors.white),
        ),
      ],
    ),
  ),
);

provider中的相关代码:

// initial values for loading and loadingMessage
bool loading = false;
String loadingMessage;

void createAccountClicked(BuildContext context) {
  print("Create account clicked");
  validateAllFields();

  if (name != null &&
      email != null &&
      password != null &&
      confirmPassword != null) {

    loading = true;
    loadingMessage = "Creating new user";
    notifyListeners(); // <- nothing happens when this is called :(

    RestEndpoints.createNewUser(name, email, password, confirmPassword, "on")
        .then(createUserSuccess, onError: createUserError);
  }
}

void createUserSuccess(response) {
  print(response.data);
  if (response.data["status"] == "OK") {
    loading = false;
    notifyListeners();
  }
}

void createUserError(error) {
  loading = false;
  print("Error creating new user: ${error.toString()}");
  notifyListeners();
}

对话框的相关位:

@override
Widget build(BuildContext context) {
  final createAccountProvider = Provider.of<CreateAccountProvider>(context);

  // ...

  return AlertDialog(
    content: Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Visibility(
          visible: createAccountProvider.loading, //<-- this is never visible
          child: Loading(createAccountProvider.loadingMessage),
        ),
        Visibility(
          visible: !createAccountProvider.loading, //<-- this is always visible
          child: SingleChildScrollView(
            child: Column(
              children: <Widget>[
                SizedBox(height: 30),
                title,
                SizedBox(height: 30),
                subText,
                SizedBox(height: 30),
                confirmCodeTextField,
                SizedBox(height: 50),
                infoBox,
                newVerificationCode,
                continueButton
              ],
            ),
          ),
        ),
      ],
    ),
  );
}

问题:当 notifyListeners() 被调用时，如何让我的对话更新？

Answer 1

在这一行之后:

notifyListeners(); // <- nothing happens when this is called :(

您有一行可以立即调用 loading = false; here:

RestEndpoints.createNewUser(name, email, password, confirmPassword, "on")
        .then(createUserSuccess, onError: createUserError);

可能你遇到了某种错误，所以 createUserError 可能会立即被调用，这会在此处设置 loading = false;:

void createUserError(error) {
  loading = false;
  print("Error creating new user: ${error.toString()}");
  notifyListeners();
}

尝试在没有此行的情况下运行您的代码:

RestEndpoints.createNewUser(name, email, password, confirmPassword, "on")
        .then(createUserSuccess, onError: createUserError);