2

我对如何将 stateNotifier 与 Riverpod 一起使用感到困惑。那里的大多数教程都使用了反例，这很好，但对我来说仍然不是很清楚。我正在尝试实现具有 2 个状态的 stateNotifier： isDrawerOpen 和 isDrawerColor 返回布尔结果。一些函数会触发这些状态的变化。以下是我已经实施的并且可以真正使用一些澄清。

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;
});
4

1 回答 1

2

您可以如下创建一个单独的状态类（我使用的是 equattable 包）

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 将如下所示。我们将创建一个抽屉控制器来控制抽屉的状态。

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

我们的 DrawerController 看起来像这样。

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

您可以在 UI 中的任何位置调用 changeDrawer 方法context.read(drawerProvider).changeDrawer(true);

于 2021-01-18T11:55:50.400 回答