之前学习了Widget, Layout,网络异步。
今天了解一下Flutter app里UI之间的数据是如何传递的。
第一种方法最简单,就是简单的app,简单的页面导航,可以直接通过构造函数。
比如有两个页面,从Master Page到Detail Page,数据是一个变量title。
可以把Detail页面的构造函数中增加title这个参数,在从Master路由到Detail时直接赋值即可。
见官方例子:
https://flutter.io/cookbook/navigation/passing-data/
第二种方法,会比较常用一些,就是InheritedWidget。名字比较奇怪,但是用法很简单。
正常情况页面都会比较复杂,层次也会很深。所以用构造函数传递数据是很麻烦的。
按照Flutter的设计,这个方法是比较标准的做法。
比如主题的读取就是用到了这个方法:
new TextFormField(
key: firstNameKey,
style: Theme.of(context).textTheme.headline,
decoration: new InputDecoration(
hintText: 'First Name',
),
)
那么数据在主页面的widget里面,你想传递到很多层以后的一个widget,怎么办呢?
创建一个Inherited Widget,将数据放到这个widget里。在需要的地方调用of方法并传递context即可。
InheritedWidget的定义:
https://docs.flutter.io/flutter/widgets/InheritedWidget-class.html
通过它可以将数据传递给树形结构下所有的子widget。
注意因为是静态类型的,所以变量必须声明为final。
具体的例子有很多,比如:
https://medium.com/@mehmetf_71205/inheriting-widgets-b7ac56dbbeb1
第三种方法,通过scoped model,这是一个packag
https://pub.dartlang.org/packages/scoped_model
这种方法会更加灵活,通过了一个监听模式来实现。变量需要集成scoped model,
然后数据在改变以后,需要调用一下notifylistener方法来通知所有需要的对象。
第四种,比较少用的就是flutter版本的redux。
flutter redux什么时候需要用呢?以上所有办法都搞不定的时候,你可以试一下。