带钩子的 Riverpods Flutter - 使用 Provider

Kat*_*ieK 3 flutter flutter-dependencies flutter-state flutter-hooks riverpod

有人可以给出一个在 Riverpods 中最好使用 Riverpod_hooks 进行额外状态修改的示例 - 我希望能够在不制作额外小部件的情况下使用它,例如:

onPress: () {
           useProvider(genderProvider).state = Gender.female;
           },
Run Code Online (Sandbox Code Playgroud)

我在理解 Riverpods 文档中关于如何使用该提供程序(一旦实现该提供程序)时遇到了一些困难。我理解增量部分.state++,但我找不到初始化后更改状态值的明确示例。正如 x 被初始化为零,但您只想将其设为 42 或输入值。

例如,我有一个性别 {male、female、non-binary} 枚举,并且创建了一个 GenderProvider,但我无法找出使用按钮更改应用程序中性别的最佳方法。我也不完全确定 Provider 和 RiverPods 有多相似,似乎有很多语义差异?

这是当前在我的代码中声明提供程序的方式:

enum Gender {
  male,
  female,
  nonBinary
}

final genderProvider = StateProvider((_) => Gender.female);
Run Code Online (Sandbox Code Playgroud)

预先感谢,我感谢任何建议。

Thi*_*rry 6

onPress: () => context.read(genderProvider).state = Gender.female,
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

完整源代码:

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';

void main() {
  runApp(
    ProviderScope(
      child: MaterialApp(
        debugShowCheckedModeBanner: false,
        title: 'Flutter Demo',
        home: HomePage(),
      ),
    ),
  );
}

class HomePage extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final gender = useProvider(genderProvider).state;
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Gender: ${describeEnum(gender)}'),
            const SizedBox(height: 16.0),
            ElevatedButton(
              child: Text('MALE'),
              onPressed: () => context.read(genderProvider).state = Gender.male,
            ),
            const SizedBox(height: 8.0),
            ElevatedButton(
              child: Text('FEMALE'),
              onPressed: () =>
                  context.read(genderProvider).state = Gender.female,
            ),
          ],
        ),
      ),
    );
  }
}

enum Gender { male, female, nonBinary }

final genderProvider = StateProvider((_) => Gender.female);
Run Code Online (Sandbox Code Playgroud)