发出新的 state 时肘位不重建

Question

每当我调用 toggleLocked 事件时，BlocBuilder 都不会重建小部件。

我在互联网上看了很多，发现了这个解释： https://stackoverflow.com/a/60869187/3290471我认为在某个地方我错误地使用了平等的 package，这导致 BlocBuilder 认为没有任何改变（虽然是有）。

我已经阅读了 Bloc libray 中的常见问题解答，并且三个提供的解决方案（平等的道具/不重用相同的 state/使用 fromList）似乎无法解决问题。

我的肘：

class LockCubit extends Cubit<LockState> {
  LockCubit({@required this.repository})
      : assert(repository != null),
        super(LockInitial());

  final LocksRepository repository;

  Future<void> fetch() async {
    try {
      final locks = await repository.fetchLocks();
      emit(LocksDisplayed().copyWith(locks));
    } on Exception {
      emit(LockError());
    }
  }

  Future<void> toggleLocked(int id) async {
    try {
      final locks = await repository.toggleLocked(id);
      emit(LocksDisplayed().copyWith(List.from(locks)));
    } on Exception {
      emit(LockError());
    }
  }
}

我的状态：

abstract class LockState extends Equatable {
  const LockState();

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

class LockInitial extends LockState {
  @override
  String toString() => 'LocksUninitialized';
}

class LockError extends LockState {
  @override
  String toString() => 'LockError';
}

class LocksDisplayed extends LockState {
  final List<Lock> locks;

  const LocksDisplayed([this.locks = const []]);

  LocksDisplayed copyWith(locks) => LocksDisplayed(locks ?? this.locks);

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

  @override
  String toString() => 'LocksDisplayed { locks: $locks }';
}

我的 model：

class Lock extends Equatable {
  Lock({this.id, this.name, this.locked, this.displayed});

  final int id;
  final String name;
  final bool locked;
  final bool displayed;

  @override
  String toString() =>
      'Lock { id: $id name: $name locked: $locked displayed: $displayed }';

  Lock copyWith({id, name, locked, displayed}) => Lock(
      id: id ?? this.id,
      name: name ?? this.name,
      locked: locked ?? this.locked,
      displayed: displayed ?? this.displayed);

  @override
  List<Object> get props => [id, name, locked, displayed];
}

我的存储库：

class LocksRepository {
  List<Lock> locks = [];

  Future<List<Lock>> fetchLocks() async {
    // This is a temporary implementation
    // In the future the data should be fetched from a provider

    locks = [
      new Lock(
        id: 0,
        name: 'Voordeur',
        locked: false,
      ),
      new Lock(
        id: 1,
        name: 'Achterdeur',
        locked: false,
      )
    ];

    return locks;
  }

  Future<List<Lock>> toggleLocked(int id) async {
    // This is a temporary implementation
    // In the future a request to change a lock should be made and then the specific lock should be retrieved back and edited.

    locks[id] = locks[id].copyWith(locked: !locks[id].locked);

    return locks;
  }
}

我正在使用以下触发器更改 state：

context.read<LockCubit>().toggleLocked(focusedIndex);

我正在使用这样的 BlocBuilder 来构建 state：

BlocBuilder<LockCubit, LockState>(builder: (context, state) {
      print('State Changed');

      if (state is LockInitial) {
        return Text('lockInitial');
      }

      if (state is LocksDisplayed) {
        return Swiper(
            itemBuilder: (BuildContext context, int index) {
              return Column(
                children: [
                  Text(state.locks[index].name),
                  Text(state.locks[index].locked.toString())
                ],
              );
            },
            onIndexChanged: onIndexChanged,
            loop: true,
            itemCount: state.locks.length);
      }

      if (state is LockError) {
        return Text('lockError');
      }

      return Container();
    });

所有帮助将不胜感激。

Answer 1

你可以检查 BlocProvider 吗？ 我遇到了同样的问题。 如果这个 bloc 在 materialApp 中，你必须传递 BlocProvider.value 而不是在小部件中创建。

Answer 2

我有点困惑，如果这可以工作。 但是对于一个集团，您将使用一个事件而不是肘位（即使事件是基于肘位的）。

所以首先我会使用标准模式：state event bloc with mapEventToState

然后，我在你的代码中也没有看到，如果你切换你的锁，它会在伪代码中看起来像这样

if (event is toggleLock) {
  yield lockInProgress();
  toggleLock();
  yield locksDisplayed;
}

这样，您的 state 总是从 locksDisplayed 更改为 lockInProgress 到 locksDisplayed - 正如您在上面的链接中阅读的那样