Redux State throughout Flutter App Not Working

时间:2018-03-23 00:41:10

标签: redux dart flutter

I'll preface by saying I am new to Dart and Flutter, so my problem may be obvious but illusive to me so far.

I am working on integrating Redux into my Flutter application. Managing the state in the first view from launch is working as expected. However, when moving to a new "view" through a route name after the launch of the app using.

onTap: () {
    Navigator.of(context).pushNamedAndRemoveUntil(
        '/dashboard',
        (Route<dynamic> route) => false
    );
},

the Dashboard widget looks like this:

class DashboardHome extends StatelessWidget {

  @override
  Widget build(BuildContext context) {

    final _l10n = HnLocalizations.of(context);

    return new Scaffold(
      appBar: HnAppBar.dashboardSettings(),
      bottomNavigationBar: new HnTabBar(),
      backgroundColor: HnColors.purple,
      body: new StoreConnector(
        converter: (store) => store.state.activeSegment,
        builder: (context, int) => new Container(
          decoration: new BoxDecoration(
            image: new DecorationImage(
              image: new AssetImage(AppGraphics.bgWorldly),
              fit: BoxFit.fitWidth,
              alignment: new Alignment(0.0, 0.0),
            ),
          ),

the view throws an error of

NoSuchMethodError: The getter 'store' was called on null
Receiver: null
Tried calling: store

My Main looks like this:

void main() {

  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp
  ]);

  final store = new Store(
    appReducer,
    initialState: new HnAppState(),
  );


  runApp(new MaterialApp(
    debugShowCheckedModeBanner: false,
    localizationsDelegates: [
      const HnLocalizationsDelegate(),
      GlobalMaterialLocalizations.delegate,
      GlobalWidgetsLocalizations.delegate,
    ],
    supportedLocales: [
      const Locale('en', 'US'),
    ],
    onGenerateTitle: (BuildContext context) =>
      HnLocalizations.of(context).appName,
    color: HnColors.canvas,
    theme: HnTheme.baseTheme(),
    home: new StoreProvider(
      store: store,
      child:new AppLaunch()
    ),
    routes: <String, WidgetBuilder>{
      "/home": (BuildContext context) => new WelcomeHome(),
      "/dashboard": (BuildContext context) => new DashboardHome(),
      "/dashboard/settings/account": (BuildContext context) => new AccountProfileSegmentHome()
    },
  ));

}

From my understanding of the documentation, once the StoreProvider has been set at the top of the application, 'StoreConnector' should have access to store. For me, that does not seem to be the case. My first inclination is to pass store through the route as in:

"/dashboard": (BuildContext context) => new DashboardHome(store)

But that seems very off and defeats the purpose of having state accessible from the top of the application.

What am I missing?

1 个答案:

答案 0 :(得分:0)

您使用的是什么版本的flutter_redux? 新版本的flutter_redux添加了对dart 2的支持,因此您可能必须遵循https://pub.dartlang.org/packages/flutter_redux#-readme-tab-中的“Dart 2迁移指南”

你有没有试过这样的事情:

runApp(new StoreProvider(
  store: store,
  child:new MaterialApp(...)

当您推送其他路线时,将StoreProvider放在主页中会出现问题。 Brian已经使用StoreProvider位于小部件树顶部的示例更新了自述文件(https://github.com/brianegan/flutter_redux)。