Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Store error #138

Open
jingzhanwu opened this issue Jun 13, 2019 · 6 comments
Open

Store error #138

jingzhanwu opened this issue Jun 13, 2019 · 6 comments

Comments

@jingzhanwu
Copy link

Can you define multiple Stores? My requirement is: a global Store, other pages have a separate Store; I now create two Stores, one is initialized in Main, the other is initialized in the sub-page, the result of sub-page error.

void main() {
runApp(new IndexPage());
SystemUiOverlayStyle style =
new SystemUiOverlayStyle(statusBarColor: Colors.transparent);
SystemChrome.setSystemUIOverlayStyle(style);
}

//Entrance page
class IndexPage extends StatelessWidget {
///INIT store
final store = new Store(appReducer,
initialState: new APPState(
user: User(
id: "001",
name: "TEST",
pwd: "123456",
sex: 28.toString(),
address: "")));

@OverRide
Widget build(BuildContext context) {
return StoreProvider(
store: store,
child: StoreBuilder(builder: (context, store) {
return MaterialApp(
title: "title",
routes: {
"main": (BuildContext context) => MainPage(),
},
theme: new ThemeData(
primaryColor: Color(0xff0081F9),
),
home: LoginPage(),
);
}),
);
}
}

///sub page
class MicroGroupList extends StatefulWidget {
@OverRide
State createState() {
return _GroupState();
}
}

class _GroupState extends State
with AutomaticKeepAliveClientMixin {
final store = new Store(groupReducer,
middleware: [groupMiddleware], initialState: MicroGroupState(groups: []));

// List _groupList = [];
bool _loading = true;

@OverRide
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((callback) {
_refreshData();
});
}

@OverRide
bool get wantKeepAlive => true;

@OverRide
Widget build(BuildContext context) {
return StoreProvider(
store: store,
child: StoreConnector<MicroGroupState, List>(
builder: (context, list) {
return Scaffold(
body: RefreshIndicator(
onRefresh: _refreshData,
child: ListView.builder(
physics: BouncingScrollPhysics(),
itemCount: list.length,
itemBuilder: (context, index) {
return _MicroGroupItem(list[index]);
}),
),
);
},
converter: (store) => store.state.groups),
);
}

@miquelbeltran
Copy link
Contributor

Hi @jingzhanwu Could you post a link to a sample project that showcases the issue you have? I looked at the code you posted after copying to a project but there's parts missing.

@jingzhanwu
Copy link
Author

Sorry, the code is not available for the time being! My question is: Can Store initialize more than one in the entire application? For example, different pages initialize different Stores instead of global ones. BloC can do this, and I make mistakes when I try to do it in Flutter-Redux.

@miquelbeltran
Copy link
Contributor

You could define multiple Stores, then use two StoreProviders, like this:

import 'package:flutter_redux/flutter_redux.dart';
import 'package:redux/redux.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final storeAppState = Store<AppState>(
    combineReducers([]),
  );
  final storeSecondAppState = Store<SecondAppState>(
    combineReducers([]),
  );

  @override
  Widget build(BuildContext context) {
    return StoreProvider<AppState>(
      store: storeAppState,
      child: StoreProvider<SecondAppState>(
        store: storeSecondAppState,
        child: MainScreen(),
      ),
    );
  }
}

class AppState {}

class SecondAppState {}

class MainScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: StoreConnector<AppState, AppState>(
        converter: (store) => store.state,
        builder: (c, s) => StoreConnector<SecondAppState, SecondAppState>(
          converter: (store) => store.state,
          builder: (c, s) => Scaffold(),
        ),
      ),
    );
  }
}

However, I would recommend you to not to do this, having multiple Stores can be a source of issues: https://stackoverflow.com/questions/33619775/redux-multiple-stores-why-not (this is for JS but the same learnings apply)

@jingzhanwu
Copy link
Author

Thank you!
If you have information about Reducer and Middleware in Flutter-Redux, can I link to it? This is especially used in combination with combineReducers and asynchronous.

@miquelbeltran
Copy link
Contributor

The best source I've found is @brianegan architecture samples like https://github.com/brianegan/flutter_architecture_samples/tree/master/redux

@maheshbhattaraai
Copy link

@miquelbeltran
My issue is same as @jingzhanwu How can we store different page state which not required to be global. In react from reducer we can achieve state for specific reducer. How can we implement specific page state from redux.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants