• 類Provider只暴露值，不觸發(fā)任何rebuild（不會(huì)通知監(jiān)聽(tīng)者），對(duì)于Provider，context.read()和context.watch()沒(méi)有什么區(qū)別。

class MyModel {
  var num1 = 0;
  var num2 = 1;
}
// ...
  @override
  Widget build(BuildContext context) {
    return Provider(
      create: ((context) {
        return MyModel();
      }),
      builder: (context, child) {
        return Text('${context.read<MyModel>().num1} and ${context.read<MyModel>().num2}');
      },
    );
  }

• 如果需要監(jiān)聽(tīng)值的改變，使用ChangeNotifierProvider，并在其builder中使用值的地方使用context.watch()獲取值。如果使用context.read()，值改變不會(huì)rebuild。

class MyModel extends ChangeNotifier {
  var num1 = 0;
  var num2 = 1;
}
// ...
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: ((context) {
        return MyModel();
      }),
      builder: (context, child) {
        return Text('${context.watch<MyModel>().num1} and ${context.watch<MyModel>().num1}');
      },
    );
  }

• ChangeNotifierProvider()的create會(huì)創(chuàng)建新的Listenable對(duì)象，在當(dāng)前節(jié)點(diǎn)被移除時(shí)，這個(gè)對(duì)象也會(huì)被銷毀。

• 如果你的Listenable對(duì)象需要在節(jié)點(diǎn)被移除時(shí)依然存在不被銷毀，那么使用ChangeNotifierProvider.value()。

  final model = MyModel();

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider.value(
      value: model,
      builder: (context, child) {
        return Text('${context.watch<MyModel>().num1} and ${context.watch<MyModel>().num1}');
      },
    );
  }

• 以ChangeNotifierProvider為例，只要builder中的內(nèi)容足夠少，那么每次值改變后rebuild的內(nèi)容越少。但如果讀取ChangeNotifierProvider的value的地方很多，但不希望這些地方都要rebuild，可以配合使用Consumer。

class MyModel extends ChangeNotifier {
  var num1 = 0;
  var num2 = 1;

  addNum2() {
    num2++;
    notifyListeners();
  }
}
// ...
  final model = MyModel();
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider.value(
      value: model,
      builder: (context, child) {
        return Column(
          children: [
            Text('${context.read<MyModel>().num1}'),
            Consumer<MyModel>(builder: ((context, value, child) {
              return Text('${value.num2}');
            })),
            ElevatedButton(
              onPressed: () {
                model.addNum2();
              },
              child: const Icon(Icons.add),
            ),
          ],
        );
      },
    );
  }