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

我正在尝试使用 Counter 测试应用程序使用 BloC 库，但是当我使用对象来递增/递减计数器时，我的视图中出现了一些问题。 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;
    }
  }
}

如您所见，我对示例应用程序进行了一些编辑以添加我的课程TestTest具有 int 属性myProperty。当我单击按钮时，对象中的值会发生变化，但我的视图不会刷新。

我该如何解决这个问题？

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

谢谢

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

如果你这样做yield对于同一状态两次。您的用户界面不会更新。

例如，如果您已经触发了ShowDataToUser(data)从你的集团，现在经过另一次操作你正在屈服ShowDataToUser(data)同样，您的用户界面将不会更新。

解决这个问题的一个快速技巧就是创建一个DummyState()在你的集团和产量DummyState()每次在你屈服之前ShowDataToUser(data)

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

Enters Equatable

为此，您需要使用该包：https://pub.dev/packages/equatable

现在你必须用公平寿命来延长你的集团状态：

class DummyState extends Equatable {}

现在，如果您的 Bloc States 正在扩展 Equatable 那么您必须重写该函数：

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

Here name是在比较两个相同类时要比较的属性/字段名称。

这个函数告诉你的 Bloc，如何区分两个相同的状态（其中可能有不同的值）。