How to implement Route Navigation with async_redux

Question

I'm new in Flutter and Dart and found a new "async_redux" package in https://pub.dev/packages/async_redux to develop my project easier way than traditional "redux" package. In readme document there is a short description about implement Route Navigation but I always receive:

"type 'NavigateAction' is not a subtype of type 'ReduxAction' of 'action'"

when i use -dispatch(NavigateAction.pushNamed("MyRoute"))- in "onChangePage".

Here the structure code:

Store<AppState> store;
final navigatorKey = GlobalKey<NavigatorState>();

void main() async{
  NavigateAction.setNavigatorKey(navigatorKey);
  var state = AppState.initialState();
  store = Store<AppState>(initialState: state);
  runApp(MyApp());
}

final routes={
  '/': (BuildContext context) => First(),
  "/myRoute": (BuildContext context) => Two(),
};

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StoreProvider<AppState>(
      store: store,
      child: MaterialApp(
        routes: routes,
        navigatorKey: navigatorKey,
      ),
    );
  }
}

class AppState {
  AppState(...);
  AppState copy(...) =>
      AppState(
        ...
      );
  static AppState initialState() => AppState(
    ...
  );
  @override
  bool operator ==(Object other) =>    ...
  @override
  int get hashCode => ...;
}

class First extends StatelessWidget {
  @override
  Widget build(BuildContext context) => MyHomePageConnector();
}

class MyHomePageConnector extends StatelessWidget {
  MyHomePageConnector({Key key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return StoreConnector<AppState, ViewModel>(
      model: ViewModel(),
      builder: (BuildContext context, ViewModel vm) => MyHomePage(
        onChangePage: vm.onChangePage
      ),
    );
  }
}

class ViewModel extends BaseModel<AppState> {
  ViewModel()
  VoidCallback onChangePage;
  ViewModel.build({
    @required this.onChangePage,
  }) : super(equals: []);

  @override
  ViewModel fromStore() => ViewModel.build(
    onChangePage: () => dispatch (NavigateAction.pushNamed ("/myRoute"))
  );
}

class MyHomePage extends StatefulWidget {
  final VoidCallback onChangePage;
  MyHomePage({
    Key key,
    this.onChangePage
  }) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

@override
  Widget build(BuildContext context) {
    return RaisedButton(
       child: Icon(Icons.add_circle),
           onPressed: widget.onChangePage
           ),  
    );
  }
}

How and where implement "dispatch(NavigateAction.pushNamed ("/myRoute"))"?

Answer 1

Try this:

dispatch(NavigateAction<AppState>.pushNamed("/myRoute"))"

Update:

With recent async_redux: ^1.2.0 you don't need the <AppState> anymore, and can dispatch it like this:

dispatch(NavigateAction.pushNamed("/myRoute"))"