在 API 次调用后使用 Provider 更新状态

Question

调用 API 将其更新为 BE 后，如何使用 Provider 更新状态？我将参数从一个屏幕传递到另一个屏幕，然后在我编辑文本后，我触发了对 BE 的 API 调用，我得到了响应的 return 值，我想更新状态与提供者的回应。这怎么可能？这是代码：

我在这里调用 API 并传递我在文本字段中编辑的参数：

onPressed: () async {
                  final updatedUser = await    await APICall.updateUser(
                          userID,
                          updateName,
                          updateEmail,
                        );
        Provider.of<UserStore>(context, listen: false)
                      .updateUser(updatedUser);
                      Navigator.pop(context);
                    },

这是 API 调用，我 return 更新用户的响应：

Future<User> updateUser(String userID, String name, String email) async {
    final response =
        await APICalls.apiRequest(Method.PATCH, '/users', this._jsonWebToken,
            body: jsonEncode({
              "id": userID,
              "name": name,
              "email": email,
            }));
    Map<String, dynamic> jsonDecodedResponse = jsonDecode(response.body);
    return User(
        id: jsonDecodedResponse['data']['id'],
        name: jsonDecodedResponse['data']['name'],
        email: jsonDecodedResponse['data']['email'],
    );
  }

现在我想传递我从 API 调用中获得的响应，以将其传递给提供者状态：

deleteUser(User list) {
    _userList.remove(list);
    notifyListeners();
  }

  addUser(User list) {
    _userList.add(list);
    notifyListeners();
  }

updateUser(User ){//I'm not sure how do define the updateUser method...
   notifyListeners();
}

只有当我刷新小部件时，更新才会在 BE 端和 FE 上运行，而不是在响应 returned 后立即运行，这是我希望它运行的方式。

Answer 1

class UserStore extends ChangeNotifier {
   List<User> clientList = [];

   void deleteUser(User list) {
      clientList.remove(list);
      notifyListeners();
   }

   void addClient(User list) {
      clientList.add(list);
      notifyListeners();
   }

   void updateUser(User user){
      clientList[clientList.indexWhere((element) => element.id == user.id)] = user;
      notifyListeners();
   } 
}

您现在要做的是在您的小部件上收听此提供程序。当用户更新时，更改将应用于任何侦听 clientList 的小部件。

请注意，我已将 clientList 变量更改为 public，因此它可以被外部的任何小部件侦听。

在 API 次调用后使用 Provider 更新状态

Updating State with Provider after API call

mobile

flutter

flutter-provider