Как использовать более одного ChangeNotifierProvider в Flutter? - PullRequest
Новая
       31

Как использовать более одного ChangeNotifierProvider в Flutter?

0 голосов
/ 09 апреля 2020

Я недавно начал использовать provider для управления состоянием, и я знаю, как использовать по одному. 

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ChangeNotifierProvider<Reader>(
        create: (context) => new Reader(),
        child: _HomeBody(),
      ),
    );
  }
}

Но теперь у меня есть два разных класса, и я хочу добавить их оба и быть в состоянии получить доступ в моем дереве виджетов.

Как добавить несколько ChangeNotifierProvider в Flutter?

Ответы [ 2 ]

1 голос
/ 09 апреля 2020

Один из вариантов (не рекомендуется) - это вложение 2-х провайдеров: 

ChangeNotifierProvider<Reader>(
  create: (_) => Reader(),
  child: ChangeNotifierProvider<SomethingElse>(
    create: (_) => SomethingElse(),
    child: ChangeNotifierProvider<AnotherThing>(
      create: (_) => AnotherThing(),
      child: someWidget,
    ),
  ),
),

Это не рекомендуется, потому что, как указано в документации:

При вводе большого числа значений в больших приложения, провайдер может быстро стать довольно вложенным:

Но еще одно предложение от самого пакета Provider заключается в использовании MultiProvider : 

  providers: [
    ChangeNotifierProvider<Reader>(create: (_) => Reader()),
    ChangeNotifierProvider<SomethingElse>(create: (_) => SomethingElse()),
    ChangeNotifierProvider<AnotherThing>(create: (_) => AnotherThing()),
  ],
  child: _HomeBody(),
)

Оба подхода работают одинаково, но второй более читабелен. В документации приведены слова:

Поведение обоих примеров строго одинаково. MultiProvider изменяет только внешний вид кода.

Пример, адаптированный со страницы пакета флаттера провайдера и адаптированный к вашему случаю.

1 голос
/ 09 апреля 2020

Вы можете использовать MultiProvider

Это руководство помогло мне, надеюсь, оно вам тоже поможет ... 

MultiProvider(
  providers: [
    ChangeNotifierProvider<Counter>(builder: (context) => Counter(0)),
    ProxyProvider<Counter, ThemeSwitch>.custom(
      builder: (context, counter, previous) {
        final theme = previous ?? ThemeSwitch(ThemeState.light);
        theme.themeState =
              (counter.value > 5) ? ThemeState.dark : ThemeState.light;
        return theme;
      },
      dispose: (context, value) => value.dispose(),
      providerBuilder: (_, value, child) =>
          ChangeNotifierProvider.value(notifier: value, child: child),
    ),
  ],
)
...