使用Redux的Flutter中的路由

问题描述 投票:1回答:1

当我们使用Redux时,在Flutter App中管理路线的最佳位置在哪里?因为即时消息遵循一些示例,其中一些示例在操作中进行路由,其他示例在中间件中甚至在容器中进行路由。

flutter redux routing flutter-redux
1个回答
0
投票

您可以调度常规操作以触发导航。

class NavigationService {

 static NavigationService _service;

 NavigationService.__internal();

  factory NavigationService.instance(){
     if(_service == null){
     _service = new NavigationService.__internal();
   }
 return _service;
}

final GlobalKey<NavigatorState> _navigatorKey = GlobalKey<NavigatorState>();

Future<dynamic> pushNamed(String routeName, {dynamic arguments}) {
  return _navigatorKey.currentState.pushNamed(routeName, arguments:arguments);
}

bool pop() {
    return _navigatorKey.currentState.pop();
}

GlobalKey<NavigatorState> get navigatorKey => this._navigatorKey;
}

RouteMiddleware负责与路由有关的所有操作

class RouteMiddleware<Action> extends TypedMiddleware<AppState, Action> {
  RouteMiddleware() : super(null);

  @override
  void call(Store<AppState> store, action, next) {
    if(action is YourRoutingAction){
      NavigationService.getInstance().pushedNamed(action.pageName);
    }
    next(action);
   }
}

将与路由相关的操作作为常规操作分发

goToHomePageAfterDataLoad(store) {
   dataLoadLoadLogic().then((data){
   store.dispatch(RoutingAction(pageName: "HOME"));
  });
}
© www.soinside.com 2019 - 2024. All rights reserved.