4

在开始使用 Flutter 和 redux 构建应用程序时，我遇到了以下问题：处理网络请求或任何异步操作的最佳方式是什么？

上下文：当请求完成更新状态并查看视图中的更改时，进行异步调用以从服务器端获取字符串（在我的情况下只是 Future.delayed）。

第一种方法：

创建一个具有异步调用函数的中间件类，该函数将在异步事件完成调用 NextDispacther 后等待异步事件完成，该操作将在减速器中处理

 class UserTypeMiddleware extends MiddlewareClass<AppState> {

      @override
      void call(Store<AppState> store, action, NextDispatcher next) async{
        if (action is GetTitleAction) {
          String title = await Future<String>.delayed(Duration(seconds: 2), () {
            return "This is a title ";
          });
          next(UpdateTitleAction(title));
        } else {
          next(action);
        }
      }

    }

第二种方法：

创建一个 typedMiddleware 做同样的事情，但它通过 store.dispatch 调度操作

TypedMiddleware<AppState, GetTitleAction> userTypeMiddleware() =>
    TypedMiddleware<AppState, GetTitleAction>(_getTitle);

Future _getTitle(Store<AppState> store, GetTitleAction action, NextDispatcher next) async {
  String title = await Future<String>.delayed(Duration(seconds: 2), () {
    return "Flow.me este o aplicatie care va permite sa inchiriati un scooter ";
  });
  store.dispatch(UpdateTitleAction(title));
  next(action);
}

第三种方法：

使用 redux_thunk

ThunkAction<AppState> updateTitleAction = (Store<AppState> store) async {
  String title = await Future<String>.delayed(Duration(seconds: 2), () {
    return "Flow.me este o aplicatie care va permite sa inchiriati un scooter ";
  });

  store.dispatch(UpdateTitleAction(title));
};

从我的角度来看，我宁愿在中间件中处理服务器请求的逻辑，而不是在动作中处理——只是为了保持一致性——中间件与 reducer 处于同一级别，用于处理逻辑。

如果我在中间件中调用 NextDispatcher 并延迟异步请求，它会以任何方式破坏 redux 的想法吗？这可能代表一个问题吗？

4

1 回答 1

1

处理网络请求或异步操作的最佳方式是为其创建中间件，切勿在 reducer 内部处理异步操作（它是 redux 反模式，reducer 应该是纯函数），或者您可以使用redux-thunk。

于 2019-03-22T10:37:18.253 回答