标签: flutter-redux

flutter redux 中处理异步事件的最佳方法

在开始使用 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);
        }
      }

    }
Run Code Online (Sandbox Code Playgroud)

第二种方法:

创建一个 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), () …
Run Code Online (Sandbox Code Playgroud)

redux flutter flutter-redux

5
推荐指数
1
解决办法
2083
查看次数

在 Flutter 中创建私有路由

如何对我的私人路线进行包装,仅在用户获得授权时导航到屏幕,否则重定向到登录并在登录后返回原始屏幕。如何以通用的方式实现这一点,以便我在其他私人未来屏幕上重用它?

dart flutter flutter-redux

5
推荐指数
1
解决办法
684
查看次数

如何在 Flutter 中读取渲染树之外的存储值

我正在学习 flutter 并尝试与 redux 集成以进行商店管理。

我看到的所有示例都在小部件的渲染部分访问,例如:

Padding(
  padding: EdgeInsets.all(2.0),
  child: StoreConnector<AppState, List<Photo>>(
        converter: (store) => store.state.photos,
        builder: (_, photos) {
          return GridView.builder(
            itemCount: photos.length,
            itemBuilder: (BuildContext context, int index) {
              final photoUrl = photos[index].portrait;
              return Padding(
                padding: EdgeInsets.all(1.0),
                child: new Image.network(
                  photoUrl,
                  fit: BoxFit.cover,
                ),
              );
            },
            gridDelegate:                                    
            // .......
Run Code Online (Sandbox Code Playgroud)

但是如何从 initState 中的商店获取一个值,并检测该值是否发生变化,例如?我可以在渲染树之外有一个特定值的监听器吗?

谢谢你。

为清楚起见进行编辑,我正在寻找的是一些 Flutter 等价于 react 的 useSelector 能够在 useEffect 中获取值的变化

编辑:我在想一个选项(虽然不是问题的答案)可能是从父级传递值,然后在子级中使用 didChangeDependencies()

flutter flutter-redux

5
推荐指数
1
解决办法
199
查看次数

Flutter Redux:StoreConnector 与 StoreProvider

我一直在使用 flutter_redux 几天,我想知道它们之间有什么区别:

class BtnCustom extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final store = StoreProvider.of<AppState>(context);

    return FlatButton(
      onPressed: store.dispatch(MyCustomAction),
      child: Text(store.state.MyCustomTxt),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

class BtnCustom extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StoreConnector<AppState, _ViewModel>(
      converter: (store) => _ViewModel(
          txt: store.state.MyCustomTxt,
          onPressed: store.dispatch(MyCustomAction)),
      builder: (BuildContext context, _ViewModel vm) {
        return FlatButton(
          onPressed: vm.onPressed,
          child: Text(vm.txt),
        );
      },
    );
  }
}

class _ViewModel {
  final String txt;
  final void Function() onPressed;

  _ViewModel({this.txt, this.onPressed});
}
Run Code Online (Sandbox Code Playgroud)

?

第一个看起来很方便使用。我应该注意使用一种而不是另一种的优点或缺点吗? …

redux flutter flutter-redux

2
推荐指数
1
解决办法
1681
查看次数

在 Flutter 中组合减速器

我正在使用 Redux 和 Flutter 以及这个库。如果解决方案是更改为 redux dart 库,那么我会更改它。

这是我为商店提供的代码,我一直在从不同的教程中获取部分内容

@immutable
class AppState {
  final SignUpState signUpState;
  final LoginState loginState;

  AppState({
    @required this.signUpState,
    @required this.loginState,
  });
  AppState copyWith({
    SignUpState signUpState,
    LoginState loginState,
  }) {
    return AppState(
      signUpState: signUpState ?? this.signUpState,
      loginState: loginState ?? this.loginState,
    );
  }
}

AppState appReducer(AppState state, action) {  
  return AppState(
    signUpState: signUpReducer(state.signUpState, action),
    // loginState: loginReducer(state.loginState, action),
  );
}

class Redux {
  static Store<AppState> _store;

  static Store<AppState> get store {
    if (_store == null) { …
Run Code Online (Sandbox Code Playgroud)

redux flutter flutter-redux flutter-web

2
推荐指数
1
解决办法
2312
查看次数

如何在不构建 flutter redux 中的小部件的情况下调度操作?

我试图根据事件分派操作,但我找不到任何方法可以在不返回小部件的情况下实现这一目标。这是默认的做法

   StoreConnector<MyAppState,ActionFunc>(
    converter:(store) => () => store.dispatch(myaction),
    builder:(ctx,callback){
    return Center(child:
         RaisedButton(
         onPressed:(){callback();}
         child:,Text("Action !")
      ));
    });
Run Code Online (Sandbox Code Playgroud)

dart flutter flutter-redux

0
推荐指数
1
解决办法
1507
查看次数

标签 统计

flutter ×6

flutter-redux ×6

redux ×3

dart ×2

flutter-web ×1