flutter组件 InheritedWidget

本文主要是介绍flutter组件 InheritedWidget，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

InheritedWidget是一个数据共享组件，它提供了一种在 widget 树中从上到下共享数据的方式，比如我们在应用的根 widget 中通过InheritedWidget共享了一个数据，那么我们便可以在任意子widget 中来获取该共享的数据！

官方说明：Base class for widgets that efficiently propagate information down the tree.
翻译：有效地沿树向下传播信息的 widgets  的基类。
作者释义：在 widget 树中从上到下共享数据的方式，类似于react的context。

使用方法：

需要继承 InheritedWidget 类，并且实现 updateShouldNotify 方法。

当共享数据发生变化时会调用 updateShouldNotify，返回一个bool类型数据。判断是否通知子树中依赖共享数据的Widget重新build。updateShouldNotify会触发子组件的 didChangeDependencies生命周期。

示例：

import 'package:flutter/material.dart';main(List<String> args)=> runApp(const MyApp());class MyApp extends StatefulWidget {const MyApp({super.key});@overrideState<MyApp> createState() => _MyAppState();
}class _MyAppState extends State<MyApp> {int count = 0;@overrideWidget build(BuildContext context) {return CounterInheritedWidget(count: count,addCount: addCount,child: const MaterialApp(home: Scaffold(body: CounterWidget(),),),);}addCount(){setState(() {count++;});}
}// 创建一个继承自 InheritedWidget 的类，用于传递计数器值
class CounterInheritedWidget extends InheritedWidget{const CounterInheritedWidget({super.key,required this.count,required this.addCount,required super.child});final int count; // 计数值final Function addCount; // 用于修改计数值的方法// 该回调决定当count发生变化时，是否通知子树中依赖count的Widget重新build@overridebool updateShouldNotify(CounterInheritedWidget oldWidget) {return oldWidget.count != count;}// 定义一个便捷方法，方便子树中的widget获取共享数据static CounterInheritedWidget? of(BuildContext context){return context.dependOnInheritedWidgetOfExactType<CounterInheritedWidget>();}
}class CounterWidget extends StatelessWidget {const CounterWidget({super.key});@overrideWidget build(BuildContext context) {return const Center(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: [ShowCounterWidget(),AddCounterWidget()],),);}
}class ShowCounterWidget extends StatefulWidget {const ShowCounterWidget({super.key});@overrideState<ShowCounterWidget> createState() => _ShowCounterWidgetState();
}class _ShowCounterWidgetState extends State<ShowCounterWidget> {@overrideWidget build(BuildContext context) {// 在这里，我们可以使用 CounterInheritedWidget.of(context)!.count 来获取计数值return Text(CounterInheritedWidget.of(context)!.count.toString());}@overridevoid didChangeDependencies(){print('count被修改了');super.didChangeDependencies();}
}class AddCounterWidget extends StatelessWidget {const AddCounterWidget({super.key});@overrideWidget build(BuildContext context) {return ElevatedButton(onPressed: () {// 使用 CounterInheritedWidget.of(context)!.addCount 来自增计数值CounterInheritedWidget.of(context)!.addCount();},child: const Text('自增'));}
}