带有 riverpod 的多个状态的 stateNotifier

Question

我对如何将 stateNotifier 与 riverpod 一起使用感到困惑。 大多数教程都使用反例，这很好，但对我来说仍然不是很清楚。 我正在尝试实现具有 2 个状态的 stateNotifier：isDrawerOpen 和 isDrawerColor，它返回 boolean 结果。 一些功能会触发那些 state 中的更改。下面是我已经实现的，确实需要一些说明。

import 'package:flutter_riverpod/all.dart';

class DrawerNotifier extends StateNotifier{

  DrawerNotifier() : super(false);

  bool isDrawerOpen = false;
  bool isDrawerColor = false;
  
  void toggleDrawer() {
    isDrawerOpen = !isDrawerOpen;
  }
  void toggleColor() {
    isDrawerColor = !isDrawerColor;
  }
}

final drawerProvider = StateNotifierProvider((_) => DrawerNotifier());

final isDrawerOpen = StateNotifierProvider((ref){
  final state = ref.watch(drawerProvider);
  return state.isDrawerOpen;
});

final isDrawerColor = StateNotifierProvider((ref){
  final state = ref.watch(drawerProvider);
  return state.isDrawerColor;
});

Answer 1

您可以创建一个单独的 state class 如下（我正在使用 equatable 包）

abstract class DrawerState extends Equatable {
  DrawerState();
  }
class IsDrawerOpen extends DrawerState {
 UserFetchInitial();

 @override
 List<Object> get props => [];
}
class IsDrawerClosed extends DrawerState {
 UserFetched();

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

接下来，您的 drawerProvider 将如下所示。 我们将创建一个抽屉Controller来控制抽屉的state。

final drawerProvider = StateNotifierProvider<DrawerController>((_) => DrawerNotifier());

我们的 DrawerController 看起来像这样。

class DrawerController extends StateNotifier<DrawerState> { 
  void changeDrawer(bool isDrawerOpened) {
   if(isDrawerOpened) {
      state = IsDrawerOpen();
    } else { 
        state = IsDrawerClosed();
      }
  }
}

您可以使用context.read(drawerProvider).changeDrawer(true);