Flutter Riverpod StateNotifier 在页面构建时加载数据

Ale*_*ano 3 flutter flutter-state riverpod

我正在开发一个新的应用程序并使用状态通知程序测试 Riverpod,并且有一个关于在构建页面时可以在哪里加载初始数据的问题。

我有以下状态类:

abstract class SalesOrderListState extends Equatable {
  const SalesOrderListState();

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

class SalesOrderListInitial extends SalesOrderListState {}

class SalesOrderListLoading extends SalesOrderListState {}

class SalesOrderListSuccess extends SalesOrderListState {
  final List<SalesOrderListItem> salesOrderListItems;

  SalesOrderListSuccess({
    @required this.salesOrderListItems,
  });

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

class SalesOrderListError extends SalesOrderListState {
  final String error;

  const SalesOrderListError({@required this.error});

  @override
  List<Object> get props => [error];
}
Run Code Online (Sandbox Code Playgroud)

和这个 state_notifier 类:

final salesOrderListStateNotifierProvider =
    StateNotifierProvider<SalesOrderListStateNotifier>(
        (ref) => SalesOrderListStateNotifier(ref.read));

class SalesOrderListStateNotifier extends StateNotifier<SalesOrderListState> {
  final Reader read;

  SalesOrderListStateNotifier(this.read) : super(SalesOrderListInitial());

  Future<void> getSalesOrders() async {
    final SalesOrderListUseCase _salesOrderListUseCase =
        read(salesOrderListUseCaseProvider);

    state = SalesOrderListLoading();
    final result = await _salesOrderListUseCase.getSalesOrders();
    result.fold(
      (failure) =>
          state = SalesOrderListError(error: mapFailureToMessage(failure)),
      (salesOrderListItems) async {
          state = SalesOrderListSuccess(salesOrderListItems: salesOrderListItems);
      },
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

现在我的widged类(页面)使用状态通知器,如下所示:

 ...

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(),
      ),
      body: Consumer(
        builder: (context, watch, child) {
          final state = watch(salesOrderListStateNotifier.state);
          switch (state.runtimeType) {
            case SalesOrderListSuccess:
              final _salesOrders = (state as SalesOrderListSuccess).salesOrderListItems;
              ...
                 print sales orders
              ...
              );
              break;
            case SalesOrderListError:
              return MessageDisplayWidget(
                message: (state as SalesOrderListError).error,
              );
              break;
            default:
              return LoadingWidget();
          }
        },
      ),
    );
  }
Run Code Online (Sandbox Code Playgroud)

但在页面加载之前,我必须调用

context
.read(salesOrderListStateNotifierProvider)
.getSalesOrders()
Run Code Online (Sandbox Code Playgroud)

最好的方法是什么?

我已经尝试使用有状态小部件并像这样覆盖 initstate

void initState() {
    super.initState();
    Future.delayed(Duration.zero).then(
      (_) => context
          .read(salesOrderListStateNotifierProvider)
          .getSalesOrders(),
    );
    // WidgetsBinding.instance.addPostFrameCallback(
    //   (_) => context
    //       .read(salesOrderListStateNotifierProvider)
    //       .getSalesOrders(),
    // );
  }
Run Code Online (Sandbox Code Playgroud)

这可行,但我不确定这是否是最好的方法。

我有很多页面,我必须在绘制数据之前加载数据,并且我不确定将所有这些页面转换为有状态小部件以覆盖 initstate 是否是最佳解决方案。

Ale*_*ano 9

在github上@iamarnas给了我解决方案,在statenotifier构造函数中调用fetch方法

class UserNotifier extends StateNotifier<User>{
  UserNotifier() : super(User()){
    fetchData(); // It's same as initState();
  } 
}
Run Code Online (Sandbox Code Playgroud)