Flutter Flatter BloC未刷新我的视图（计数器应用程序）

我正在使用计数器测试应用程序尝试BloC库，但当我使用object递增/递减计数器时，我的视图有一个小问题。 MyObject.MyProperty递增或递减，但我的视图未刷新。为什么?

使用简单的int变量

我的对象代码：

import 'dart:async';    
import 'package:flutter/material.dart';    
import 'package:bloc/bloc.dart';
import 'package:flutter_bloc/flutter_bloc.dart';    

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

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: BlocProvider(
        builder: (context) => CounterBloc(),
        child: CounterPage(),
      ),
    );
  }
}

class TestTest{
  int myProperty; 

  TestTest(){
    myProperty = 0;
  }
}


class CounterPage extends StatefulWidget {
  @override
  _CounterPageState createState() => _CounterPageState();
}

class _CounterPageState extends State<CounterPage> {
  @override
  Widget build(BuildContext context) {
    final counterBloc = BlocProvider.of<CounterBloc>(context);

    return Scaffold(
      appBar: AppBar(title: Text('Counter')),
      body: BlocBuilder<CounterBloc, TestTest>(
        builder: (context, myClassTestTest) { 
          return Center(
            child: Text(
              '${myClassTestTest.myProperty}',
              style: TextStyle(fontSize: 24.0),
            ),
          );
        },
      ),
      floatingActionButton: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          Padding(
            padding: EdgeInsets.symmetric(vertical: 5.0),
            child: FloatingActionButton(
              child: Icon(Icons.add),
              onPressed: () {
                counterBloc.dispatch(CounterEvent.increment);
              },
            ),
          ),
          Padding(
            padding: EdgeInsets.symmetric(vertical: 5.0),
            child: FloatingActionButton(
              child: Icon(Icons.remove),
              onPressed: () {
                counterBloc.dispatch(CounterEvent.decrement);
              },
            ),
          ),
        ],
      ),
    );
  }
}


enum CounterEvent { increment, decrement }

class CounterBloc extends Bloc<CounterEvent, TestTest> {
  @override
  TestTest get initialState => TestTest();

  @override
  Stream<TestTest> mapEventToState(CounterEvent event) async* {
    switch (event) {
      case CounterEvent.decrement:        
        currentState.myProperty -= 1;
        yield currentState; 
        break;
      case CounterEvent.increment:
        currentState.myProperty += 1;
        yield currentState; 
        break;
    }
  }
}

导入'dart:async'；
进口“包装：颤振/材料.省道”；
导入“包：bloc/bloc.dart”；
进口“包装：颤振团/颤振团.飞镖”；
void main（）{
runApp（App（））；
}
类应用程序扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回材料PP(
标题：“颤振演示”，
首页：BlocProvider(
生成器：（上下文）=>CounterBloc（），
child:CounterPage（），
),
);
}
}
类测试{
不动产；
TestTest（）{
myProperty=0；
}
}
类CounterPage扩展StatefulWidget{
@凌驾
_CounterPageState createState（）=>_CounterPageState（）；
}
类_CounterPageState扩展状态{
@凌驾
小部件构建（构建上下文）{
final counterBloc=BlocProvider.of（上下文）；
返回脚手架(
appBar:appBar（标题：Text（'Counter'）），
正文：BlocBuilder(
生成器：（上下文，myClassTestTest）{
返回中心(
子：文本(
“${MyClassTest.myProperty}”，
样式：TextStyle（fontSize:24.0），
),
);
},
),
floatingActionButton:列(
crossAxisAlignment:crossAxisAlignment.end，
mainAxisAlignment:mainAxisAlignment.end，
儿童：[
填充物(
填充：边缘设置。对称（垂直：5.0），
子：浮动操作按钮(
子：图标（Icons.add），
已按下：（）{
counterBloc.dispatch（CounterEvent.increment）；
},
),
),
填充物(
填充：边缘设置。对称（垂直：5.0），
子：浮动操作按钮(
子：图标（图标。删除），
已按下：（）{
反集团调度（反事件减量）；
},
),
),
],
),
);
}
}
枚举计数器事件{递增，递减}
类CounterBloc扩展了Bloc{
@凌驾
TestTest get initialState=>TestTest（）；
@凌驾
流mapEventToState（计数器事件）异步*{
开关（事件）{
case CounterEvent.decreation：
currentState.myProperty-=1；
屈服电流状态；
打破
case CounterEvent.increment：
currentState.myProperty+=1；
屈服电流状态；
打破
}
}
}

如您所见，我对示例应用程序进行了一些编辑，只是为了添加带有int属性的class

TestTest

。当我点击我的按钮时，我的对象中的值会改变，但我的视图不会刷新

我怎样才能解决这个问题

我在

mapEventToState

中找到了一个重新创建TestTest的解决方案，但是仅仅为了更新属性而重新创建整个对象是很奇怪的

---

谢谢

我看到您正在使用某种redux实现，我不太确定在调度操作时如何处理重建

据我所知，您正在发送一个更新小部件上某些属性的操作，但您从未再次调用setState，因此小部件没有被重建

尝试在setState函数内调用递增或递减操作

大概是这样的：

onPressed: () {
 setState(() => counterBloc.dispatch(CounterEvent.decrement));
},

---

我看到您正在使用某种redux实现，我不太确定在调度操作时如何处理重建

据我所知，您正在发送一个更新小部件上某些属性的操作，但您从未再次调用setState，因此小部件没有被重建

尝试在setState函数内调用递增或递减操作

大概是这样的：

onPressed: () {
 setState(() => counterBloc.dispatch(CounterEvent.decrement));
},

---

我也遇到过同样的问题，在谷歌搜索了两个小时后，我终于找到了解决办法

如下面的代码所示，主要问题是当您生成状态时，前一个状态和当前状态是相等的，因此blocBuilder没有触发

case CounterEvent.decrement:        
  currentState.myProperty -= 1;
  yield currentState; 

你应该复制状态，然后改变并产生它

final TestTest newState = TestTest();
newState.myProperty = currentState.myProperty;

...

case CounterEvent.decrement:        
  newState.myProperty -= 1;
  yield newState; 

---

我也遇到过同样的问题，在谷歌搜索了两个小时后，我终于找到了解决办法

如下面的代码所示，主要问题是当您生成状态时，前一个状态和当前状态是相等的，因此blocBuilder没有触发

case CounterEvent.decrement:        
  currentState.myProperty -= 1;
  yield currentState; 

你应该复制状态，然后改变并产生它

final TestTest newState = TestTest();
newState.myProperty = currentState.myProperty;

...

case CounterEvent.decrement:        
  newState.myProperty -= 1;
  yield newState; 

只是为未来的访问者发布另一个可能的解决方案

如果您对同一状态执行两次

操作，则会产生
。您的UI不会更新

例如，如果您已经从集团中触发了
ShowDataToUser（data）
，并且在另一次操作后，您再次生成
ShowDataToUser（data）
，则您的UI不会更新

解决这个问题的一个快速方法是在您的Bloc中创建一个
DummyState（）
，并在每次生成
ShowDataToUser（data）

除了快速破解之外，另一个解决方案是为dart定义一种比较和等同类的方法，因为目前默认情况下，ShowDataToUser
是同一个类，但其
内容不同，但dart不知道如何评估内容并比较它们

输入
equalable

为此，您需要使用以下软件包：

现在，您必须使用Equalable扩展您的集团状态，如：

class DummyState extends Equatable {}

现在，如果您的集团状态正在扩展Equatable，则必须重写该函数：

@override
  List<Object> get props => [name];

@覆盖
列表获取道具=>[name]；

此处
name
是比较两个相同类时要比较的属性/字段名

此函数告诉您的集团，如何区分两个相同的状态（whic