Flutter Redux 和 Hook。如何像react一样观察useEffect内部变量实例的变化?

2024-05-01

我是 flutter 新手,试图观察像 React Native 这样处于减速器状态的变量“count”。我使我的 redux 和 hook 工作完美。屏幕上的变量计数发生变化,但如果我更改操作,则永远不会再次调用 useEffect(仅一次)事件。尝试了不同的方法但没有成功,并尝试将 StoreProvider.of(context).state.balanceState.count 直接放在 useEffect 的 dependentecis 中。如果我使用 useState 就应该像这样。

class StatePage extends HookWidget {
  const StatePage({Key key}) : super(key: key);   


  @override
  Widget build(BuildContext context) {

    int count = StoreProvider.of<AppState>(context).state.balanceState.count;



    useEffect(() {

      WidgetsBinding.instance.addPostFrameCallback((_) =>
          StoreProvider.of<AppState>(context).dispatch(getBalanceThunk()));
    }, [count]);

    return Scaffold(
      appBar: AppBar(
        title: Text('ola'),
      ),
      body: Center(
        child: StoreConnector<AppState, BalanceState>(
          converter: (store) => store.state.balanceState,
          builder: (context, state) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                if (state.loading)
                  Column(
                    children: [
                      CircularProgressIndicator(),
                      SizedBox(
                        height: 30,
                      )
                    ],
                  ),
                Text(state.message),
                Text(count.toString()),
                RaisedButton(
                    child: Text('Clicar'),
                    onPressed: (){
                      StoreProvider.of<AppState>(context).dispatch(SetCountAction(count++));
                    })
              ],
            );
          },
        ),
      ),
    );
  }
}

我的行动

abstract class BalanceAction {}


class BalanceStateAction  extends BalanceAction {
    final bool loading;
    final bool error;
    final String message;
    BalanceStateAction(this.loading, this.error, this.message);
}

class SetBalanceAction  extends BalanceAction {
    final double value;
    SetBalanceAction(this.value);
}

class SetCountAction  extends BalanceAction {
    final int count;

    SetCountAction(this.count);
}

我的减速机

import 'package:flutter_red_test/redux/actions/balance_action.dart';

class BalanceState {
  final bool loading;
  final bool error;
  final String message;
  final double value;
  final int count;


  BalanceState({
    this.loading = false,
    this.count = 0,
    this.error = false,
    this.message = '',
    this.value = null,
  });

  factory BalanceState.initialState(){
    return BalanceState(
      loading: false,
      error: false,
      message: '',
      value: null,
      count: 0,
    );
  }

  BalanceState copy({bool loading, bool error, String message, double value, int count}){
    return BalanceState(
        loading: loading ?? this.loading,
        error: error ?? this.error,
        message: message ?? this.message,
        value: value ?? this.value,
      count: count ?? this.count,
    );
  }
}

BalanceState balanceReducer(BalanceState state, BalanceAction action){
        if(action is BalanceStateAction){
          return state.copy(
              loading: action.loading,
              message: action.message,
              value: state.value,
              error: action.error,
            count: state.count,
          );
        }
        if(action is SetBalanceAction){
          return state.copy(
            loading: false,
            message: 'Seu saldo é de 20.000',
            value: action.value,
            count: state.count,
            error: false,
          );
        }
        if(action is SetCountAction){
          return state.copy(
            loading: false,
            message: state.message,
            value: state.value,
            count: action.count,
            error: false,
          );
        }
      return state;
}

请看这个问题:https://github.com/brianegan/flutter_redux/issues/244 https://github.com/brianegan/flutter_redux/issues/244

该库不支持开箱即用的 flutter hooks,因为它 是 Flutter 生态系统中的第 3 方包。这个库只是 专为与 flutter + redux 配合使用而构建。

请参阅替代包,例如https://pub.dev/packages/redux_hooks https://pub.dev/packages/redux_hooks以获得该功能!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter Redux 和 Hook。如何像react一样观察useEffect内部变量实例的变化? 的相关文章

随机推荐

  • Eclipse 编辑器选项卡环绕

    I can switch editors in Eclipse by using Ctrl PgUp PdDown 但是 当选择最左边的编辑器选项卡时 我无法再将一个选项卡切换到左侧并环绕以到达最右边的选项卡 如何使编辑器选项卡环绕 The
  • 用 Java 创建 PDF 的缩略图

    我正在寻找一个 Java 库 它可以获取 PDF 并从第一页创建缩略 图 PNG 我已经看过 JPedal 但其疯狂的许可费完全令人望而却步 我目前正在使用 iText 来操作 PDF 文件 但我相信它不会生成缩略图 我可以在命令行上使用
  • 如何使用Node+Express渲染多个视图

    我有一个 header html 和一个 footer html 我希望与其他视图一起呈现 我想使用 Node Express 来完成这个任务 我尝试通过以下方式渲染视图 但显然它不起作用 var express require expre
  • Javascript 图像 src 属性返回错误值

    我有一些 javascript 代码附加到一个带有 onclick 的按钮 代码如下 function ondelete var getDiv document getElementById imgdiv var lb img imgdiv
  • iPhone:应用程序被终止时保留 NSUserDefaults 值

    我正在尝试使用 NSUserDefaults 实现 添加到收藏夹 功能 到目前为止我已经编写了以下代码 void favouriteButtonClicked id sender favselected favselected favsel
  • 如何在 Anaconda 中使用 Python Dbus 绑定

    我正在尝试在 Anaconda python 环境上安装 dbus 但我很挣扎 这是我收到的错误消息 e gateway python Python 3 5 4 Anaconda custom 64 bit default Oct 13 2
  • 在intellij中为java启用ssl调试

    从我的问题开始 上一期尝试通过 tls ssl 发送 java 邮件 https stackoverflow com questions 39259578 javamail gmail issue ready to start tls th
  • 在python中乘以多维数组

    我在 3d 数组中存储了许多 2d 数组 我需要将每个数组与一个向量相乘 所以我将所有这些向量存储在一个二维数组中 就像这样 A np random random L M N B np random random L M 我需要将每个 A
  • 使用 jQuery 测试某个元素是否具有某个类

    我正在尝试测试课程是否存在intra field label在一个元素上 该元素将有多个类 我该怎么做 Use hasClass http api jquery com hasClass http api jquery com hasCla
  • C# Winforms - ProgressBar 无法正确显示和重置

    我有一个 Windows 桌面应用程序 正在使用 Visual Basic 中的 Windows 窗体编写 在这个应用程序中 我想显示一个简单的进度条 但我遇到了一个奇怪的问题 下面是更新进度条的简单 for 循环示例 pBar Visib
  • 我什么时候应该在 RMI 中实现 java.io.Serializable?

    我刚刚开始 Java RMI 对于何时使用 java io Serialized 存在一些问题 所以任何人都可以给我一个必须实现 java io Serializing 的 RMI 示例 谢谢 UPDATE i had made a sim
  • 单元格显示日期但不显示时间

    在我的 Excel 工作表中 我在一个单元格中添加了日期和时间 如下所示 在顶部 在效果栏中 它显示日期和时间 问题是 在单元格中它只显示日期 但我希望时间和日期都显示在单元格中 谁能帮我这个 选择 ColumnB 主页 gt 单元格 格式
  • bash:从数组中删除变量? [复制]

    这个问题在这里已经有答案了 bin bash tank one two three x two unset tank x echo tank 我想从数组中删除 x 但不知何故它删除了数组的第一个元素 我该如何解决这个问题 您有一个索引数组
  • Chrome 上的 BetterJsPop 错误是什么?

    我在 Chrome 上使用 React js 应用程序时遇到此错误 但在 Mozilla 上它运行得很好 有谁知道这意味着什么或者这个错误指的是什么 VM1407 20 Uncaught TypeError Cannot redefine
  • 在 StackPanel 中拉伸文本框

    这是我当前用来执行此操作的 XAML 并且我一生都无法弄清楚如何扩展文本框以填充整个列 有人可以指导我正确的方向吗 先感谢您
  • Scipy map_coordinates 双线性插值与 interp 和 IDL 插值比较

    我正在将同事的 IDL 代码重写为 python 并发现了一些我感到困惑的差异 根据我发现的其他问题和邮件列表线程 如果您使用scipy ndimage interpolation map coordinates并指定order 1它应该进
  • Sql Server 2005 将列名放在方括号中

    我最近将数据库从 Sql Server 2000 迁移到 Sql Server 2005 在表设计器中 它坚持将方括号放在名为 Content 的列周围 我在 Sql Server 的保留字列表中没有看到 Content 所以我不明白它为什
  • 为什么`.forEach`适用于密集数组但不适用于稀疏数组? [复制]

    这个问题在这里已经有答案了 我试图理解 空 稀疏数组之间的区别 例如new Array 3 和一个等效的 空 密集数组 具有 3 个未定义条目的数组 我可以通过以下两种方式创建一个包含 3 个未定义值的数组 var sparse new A
  • 估计/选择 DBSCAN 的最佳超参数

    我需要根据不同介词的分布找到自然出现的名词类别 如施事 工具 时间 地点等 我尝试使用 k means 聚类 但帮助较少 效果不佳 我正在寻找的类有很多重叠 可能是因为类的非球状形状和 k means 中的随机初始化 我现在正在使用 DBS
  • Flutter Redux 和 Hook。如何像react一样观察useEffect内部变量实例的变化?

    我是 flutter 新手 试图观察像 React Native 这样处于减速器状态的变量 count 我使我的 redux 和 hook 工作完美 屏幕上的变量计数发生变化 但如果我更改操作 则永远不会再次调用 useEffect 仅一次