FlutterでProvider.of <X>とConsumer.Xを使用する場合


13

私はまだ状態管理手法に頭を抱えており、Provider.of<X>vs Consumer<X>. をいつどのように使用するかについて少し混乱しています。これらの2つを選択すると、データにアクセスするときにProvider.ofを使用するが、UIを変更する必要がないことをドキュメントから理解しています(私はそう思います)。したがって、以下は(ドキュメントから取得)データにアクセスし、新しいイベントでUIを更新します。

return HumongousWidget(
  // ...
  child: AnotherMonstrousWidget(// <- This widget will rebuild on new data events
    // ...
    child: Consumer<CartModel>(
      builder: (context, cart, child) {
        return Text('Total price: ${cart.totalPrice}');
      },
    ),
  ),
);

一方、データのみが必要な場合は、UIで再構築したくないので、次のようにパラメーターをに設定して使用Provider.of<X>します。listenfalse

Provider.of<CartModel>(context, listen: false).add(item); \\Widget won't rebuild

ただし、listen必須ではないため、以下も実行されます。

Provider.of<CartModel>(context).add(item); \\listener optional

だから、これは私にいくつかの質問をもたらします:

  1. これは、区別するための正しい方法であるProvider.of<X>Consumer<X>。元はUIを更新しませんが、後者は更新しますか?
  2. listen設定されていない場合false、ウィジェットはデフォルトで再構築されるか、再構築されませんか?にlisten設定されている場合はどうなりtrueますか?
  3. なぜProvider.ofUIを再構築するオプションがあるのConsumerですか?

回答:


17

それは問題ではありません。しかし、物事を迅速に説明するには:

Provider.ofのみ取得し、オブジェクトを聴くための方法。 ConsumerSelector、およびすべての* ProxyProviderコールProvider.of仕事に。

Provider.ofvs Consumerは個人的な好みの問題です。しかし、両方についていくつかの議論があります

Provider.of

  • クリックハンドラーを含むすべてのウィジェットライフサイクルで呼び出すことができます。 didChangeDependencies
  • インデントを増やしません

消費者

  • より細かいウィジェットの再構築を可能にする
  • ほとんどのBuildContextの誤用を解決します

これは役に立ちます。特に他の人に対しては、この応答を受け入れます。しかし、このステートメントの参照を指すことができます:「Provider.ofは、オブジェクトを取得してリッスンする唯一の方法です。コンシューマー、セレクター、およびすべての* ProxyProviderは、Provider.ofを呼び出して機能します。」これは私がドキュメントで見たものではなく、それは本当に私を助けました!
Oprimus

2
これは、Consumer / ...がどのように機能するかの詳細な実装です。これがソースです。あなたはそれを見ることができますConsumer基本的には何もありませんが、Provider.of新しいウィジェットで
レミRousselet

BuildContextの誤用を防ぐための学習に関するリソースはありますか?
吳強福
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.