为什么 ChangeNotifierProvider.value 不更新其构建器？

Question

我有很多数据对象。每个都有一个ChangeNotifier。所以我想更新尽可能小的区域。必须进行哪些更改才能使此示例正常运行？

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  MyData _myData;

  @override
  void initState() {
    _myData = MyData(title: 'Really my data');
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Provider Test'),
      ),
      body: Center(
        child: ChangeNotifierProvider<MyData>.value(
          value: _myData,
          builder: (BuildContext _, Widget __) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                Text(_myData.toString()),
                RaisedButton(
                  child: Text('edit'),
                  onPressed: () => _myData.incrementCounter(),
                ),],);},),),);}}

class MyData with ChangeNotifier {
  String title;
  int counter = 0;

  MyData({
    this.title,
  });

  void incrementCounter() {
    counter++;
    print('counter=$counter');
    notifyListeners();
  }

  void setTitle(String newValue) {
    title = newValue;
    notifyListeners();
  }

  String toString() => '$title - $counter';
}

Answer 1

使用ChangeNotifierProvider<MyData>.value，您将 MyData 提供给它下面的小部件，但您没有在任何地方使用它。要查看 MyData 的变化，请使用 Consumer 小部件。 这是使用消费者的固定代码：

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  MyData _myData;

  @override
  void initState() {
    _myData = MyData(title: 'Really my data');
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Provider Test'),
      ),
      body: Center(
        child: ChangeNotifierProvider<MyData>.value(
          value: _myData,
          builder: (BuildContext _, Widget __) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                Consumer<MyData>(
                  builder: (context, mydata, child) {
                    return Text(_myData.toString());
                  },
                ),
                RaisedButton(
                  child: Text('edit'),
                  onPressed: () => _myData.incrementCounter(),
                ),
              ],
            );
          },
        ),
      ),
    );
  }
}

class MyData with ChangeNotifier {
  String title;
  int counter = 0;

  MyData({
    this.title,
  });

  void incrementCounter() {
    counter++;
    print('counter=$counter');
    notifyListeners();
  }

  void setTitle(String newValue) {
    title = newValue;
    notifyListeners();
  }

  String toString() => '$title - $counter';
}

Answer 2

          void main() {
            runApp(ForProvider());
          }

          class ForProvider extends StatefulWidget {
           
            @override
            _ForProviderState createState() => _ForProviderState();
          }

          class _ForProviderState extends State<ForProvider> {
            @override
            Widget build(BuildContext context) {
              return MultiProvider(providers: [
                ChangeNotifierProvider<MyData>(create: (context) => MyData()),
              ], child: MyApp());
            }
          }

          class MyApp extends StatelessWidget {
            @override
            Widget build(BuildContext context) {
              return MaterialApp(
                home: MyHomePage(),
              );
            }
          }

          class MyHomePage extends StatefulWidget {
            @override
            _MyHomePageState createState() => _MyHomePageState();
          }

          class _MyHomePageState extends State<MyHomePage> {
            MyData _myData;

            @override
            void initState() {
              _myData = MyData(title: 'Really my data');
              super.initState();
            }

            @override
            Widget build(BuildContext context) {
              return Scaffold(
                appBar: AppBar(
                  title: Text('Provider Test'),
                ),
                body: Center(
                  child: Consumer<MyData>(
                    builder: (context, myData, child) {
                      return Column(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        children: <Widget>[
                          Consumer<MyData>(
                            builder: (context, myData, child) {
                              return Text(myData.toString());
                            },
                          ),
                          RaisedButton(
                            child: Text('edit'),
                            onPressed: () => myData.incrementCounter(),
                          ),
                        ],
                      );
                    },
                  ),
                ),
              );
            }
          }

          class MyData with ChangeNotifier {
            String title;
            int counter = 0;

            MyData({
              this.title,
            });

            void incrementCounter() {
              counter++;
              print('counter=$counter');
              notifyListeners();
            }

            void setTitle(String newValue) {
              title = newValue;
              notifyListeners();
            }

            String toString() => '$title - $counter';
          }