Flutter 状态管理之 InheritedWidget 使用和分析

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CounterPage(),
    );
  }
}
 
class Counter with ChangeNotifier {
  int _count = 0;
  int get count => _count;
 
  void increment() {
    _count++;
    notifyListeners();
  }
}
 
class CounterPage extends StatefulWidget {
  @override
  _CounterPageState createState() => _CounterPageState();
}
 
class _CounterPageState extends State<CounterPage> {
  Counter _counter = Counter();
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Text('You have pushed the button this many times:'),
          CounterText(),
          RaisedButton(
            child: Text('Increment'),
            onPressed: _counter.increment,
          ),
        ],
      ),
    );
  }
 
  @override
  void dispose() {
    _counter.dispose();
    super.dispose();
  }
}
 
class CounterText extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text(
      '${context.dependOnInheritedWidgetOfExactType<_CounterModel>().counter.count}',
      style: Theme.of(context).textTheme.display1,
    );
  }
}
 
class _CounterModel extends InheritedWidget {
  final Counter counter;
 
  _CounterModel({Key key, @required this.counter, Widget child})
      : super(key: key, child: child);
 
  @override
  bool updateShouldNotify(_CounterModel old) =>
      counter.count != old.counter.count;
}

这个代码示例展示了如何使用InheritedWidget来管理状态，并且在状态发生变化时通知依赖于它的widgets。这种方式避免了使用全局变量，并且保持了widget树的高效更新。在这个例子中，我们创建了一个名为Counter的ChangeNotifier类，它包含了一个计数器和一个用于增加计数器值的方法。CounterPage是一个StatefulWidget，它在状态中创建了Counter的实例。在build方法中，它包含了CounterText widget，后者通过InheritedWidget的方式来访问计数器的值。当计数器值发生变化时，Counter通过调用notifyListeners来通知依赖于它的widgets更新。这样，我们避免了使用任何全局状态，使应用程序更容易理解和维护。