未使用数据共享时,要传递数据,只能组件间一级一级向下传递
下边代码中,创建了一个按钮,当点击时_count++
,
并将数据通过Test1(count)
传递给Test2(count)
,最终传递给Test3(count)
进行渲染展示。
import 'package:flutter/material.dart';class Demo extends StatefulWidget {@overrideState<Demo> createState() => _DemoState();
}class _DemoState extends State<Demo> {int _count = 0;@overrideWidget build(BuildContext context) {return Column(children: [Test1(_count),ElevatedButton(onPressed: (){_count++;setState(() {});}, child: Text('我是按钮'))],)}
}class Test1 extends StatelessWidget {final int count;Test1(this.count);@overrideWidget build(BuildContext context) {return Test2(count);}
}class Test2 extends StatelessWidget {final int count;Test2(this.count);@overrideWidget build(BuildContext context) {return Test3(count);}
}class Test3 extends StatefulWidget {final int count;Test3(this.count);@overrideState<Test3> createState() => _Test3State();
}class _Test3State extends State<Test3> {@overrideWidget build(BuildContext context) {return Text(widget.count.toString());}
}
InheritedWidget数据共享,优化下上边代码
import 'package:flutter/material.dart';// 声明MyData类 继承 InheritedWidget
class MyData extends InheritedWidget{// 在子组件中需要共享的数据final int data;// 构造方法const MyData({required this.data, child}):super(child: child);// 对外提供方法,方便在子组件中获取共享的数据static MyData? of(BuildContext context){return context.dependOnInheritedWidgetOfExactType<MyData>();}// 该回调决定当前data发生变化的时候,是否通知子组件依赖data的Widget:子组件中只有使用了MyData.of(context)!.data 的才会产生依赖关系@overridebool updateShouldNotify(covariant MyData oldWidget) {// 如果旧的data不等于新的data,返回true,子组件依赖data的Widget(就看子组件build中是否使用了MyData.of(context)!.data):就会触发生命周期:didChangeDependencies// 如果return false; 则不会触发:didChangeDependenciesreturn oldWidget.data != data;}
}class Demo extends StatefulWidget {@overrideState<Demo> createState() => _DemoState();
}class _DemoState extends State<Demo> {int _count = 0;@overrideWidget build(BuildContext context) {// MyData在Widget树中必须是根,MyData里边的数据才能产生共享return MyData(data: _count,child: Column(children: [SizedBox(height: 100,),Test1(_count),ElevatedButton(onPressed: (){_count++;setState(() {});}, child: Text('我是按钮'))],),);}
}class Test1 extends StatelessWidget {final int count;Test1(this.count);@overrideWidget build(BuildContext context) {return Test2(count);}
}class Test2 extends StatelessWidget {final int count;Test2(this.count);@overrideWidget build(BuildContext context) {return Test3(count);}
}class Test3 extends StatefulWidget {final int count;Test3(this.count);@overrideState<Test3> createState() => _Test3State();
}class _Test3State extends State<Test3> {@overridevoid didChangeDependencies() {// 如果有很多逻辑依赖这个数据,可以在这里进行保存print('didChangeDependencies:调用了');super.didChangeDependencies();}@overrideWidget build(BuildContext context) {// return Text(widget.count.toString());print('当数据发生变化,build重新渲染');return Text(MyData.of(context)!.data.toString());}
}