如何通过Flutter Provider创建和更新Dynamic Widgets的值
How to create and update the value of Dynamic Widgets through Flutter Provider
所以我正在实施如下内容:
class TempProvider extends ChangeNotifier(){
List<Widget> _list = <Widget>[];
List<Widget get list => _list;
int _count = 0;
int get count => _count;
Future<List<Widget>> getList() async{
addToList(Text('$count'));
List _result = await db....
_result.forEach((_item){
addToList(Button(
onTap: () => increment();
child: Text('Press'),
));
});
}
addToList(Widget widget){
_list.add(widget);
notifyListeners();
}
increment(){
_count += 1;
notifyListeners();
}
}
class Parent extends StatelessWidget{
@override
Widget build(BuildContext context) {
return FutureProvider(
create: (context) => TempProvider().getList(),
child: Child(),
);
}
}
class Child extends StatelessWidget{
@override
Widget build(BuildContext context) {
var futureProvider = Provider.of<List<Widget>>(context);
return Container(
child: futureProvider == null
? Text('Loading...'
: ListView.builder(
itemCount: futureProvider.length,
itemBuilder: (BuildContext context, int index){
return futureProvider[index];
}
),
));
}
}
基本上,它的作用是来自 Future 的小部件列表是我拥有的 ListView Builder 的内容,因为它的对象是从数据库查询生成的。这些小部件是按钮,按下时应更新 "Count" 值,并应更新显示最新 "Count" 值的文本小部件。
我能够测试这些按钮,它们似乎可以工作并且正在通过后端递增 _count 值,但是,即使更新了 Provider 值,Text Widget 上显示的 "Count" 也不会更新。
我想请您帮忙解决这里的问题,据我了解,只要值发生变化,事情就应该更新,这是 Provider 反模式吗,我是否必须重建整个 ListView,或者我还漏掉了什么?
我仍然在熟悉这个包,并且 dart/flutter 总的来说,希望您能与我分享您在这方面的专业知识。非常感谢您。
所以昨晚和今天早上我进行了大量的研究和反复试验,我只是不小心碰到了一个可行的想法!
您只需将监听值放在消费者小部件上,确保它监听我们已经在小部件树中更高层实现的最近的提供者。 (考虑到我已经在 FutureProvider Widget 下完成了我的 ListView 构建器的绘制)
..getList() async{
Consumer<ChallengeViewProvider>(
builder: (_, foo, __) => Text(
'${foo.count}',
),
);
List _result = await db....
_result.forEach((_item){
addToList(Button(
onTap: () => increment();
child: Text('Press'),
));
});
}
我还重构了我的小部件并将 Button 作为无状态小部件提取出来以供重用。尽管确保引用的按钮订阅了具有 Counter 值的同一父提供者,并让 onTap 属性 通过 Provider<>.of
调用 increment() 函数
希望这对以后的任何人都有帮助!
所以我正在实施如下内容:
class TempProvider extends ChangeNotifier(){
List<Widget> _list = <Widget>[];
List<Widget get list => _list;
int _count = 0;
int get count => _count;
Future<List<Widget>> getList() async{
addToList(Text('$count'));
List _result = await db....
_result.forEach((_item){
addToList(Button(
onTap: () => increment();
child: Text('Press'),
));
});
}
addToList(Widget widget){
_list.add(widget);
notifyListeners();
}
increment(){
_count += 1;
notifyListeners();
}
}
class Parent extends StatelessWidget{
@override
Widget build(BuildContext context) {
return FutureProvider(
create: (context) => TempProvider().getList(),
child: Child(),
);
}
}
class Child extends StatelessWidget{
@override
Widget build(BuildContext context) {
var futureProvider = Provider.of<List<Widget>>(context);
return Container(
child: futureProvider == null
? Text('Loading...'
: ListView.builder(
itemCount: futureProvider.length,
itemBuilder: (BuildContext context, int index){
return futureProvider[index];
}
),
));
}
}
基本上,它的作用是来自 Future 的小部件列表是我拥有的 ListView Builder 的内容,因为它的对象是从数据库查询生成的。这些小部件是按钮,按下时应更新 "Count" 值,并应更新显示最新 "Count" 值的文本小部件。
我能够测试这些按钮,它们似乎可以工作并且正在通过后端递增 _count 值,但是,即使更新了 Provider 值,Text Widget 上显示的 "Count" 也不会更新。
我想请您帮忙解决这里的问题,据我了解,只要值发生变化,事情就应该更新,这是 Provider 反模式吗,我是否必须重建整个 ListView,或者我还漏掉了什么?
我仍然在熟悉这个包,并且 dart/flutter 总的来说,希望您能与我分享您在这方面的专业知识。非常感谢您。
所以昨晚和今天早上我进行了大量的研究和反复试验,我只是不小心碰到了一个可行的想法!
您只需将监听值放在消费者小部件上,确保它监听我们已经在小部件树中更高层实现的最近的提供者。 (考虑到我已经在 FutureProvider Widget 下完成了我的 ListView 构建器的绘制)
..getList() async{
Consumer<ChallengeViewProvider>(
builder: (_, foo, __) => Text(
'${foo.count}',
),
);
List _result = await db....
_result.forEach((_item){
addToList(Button(
onTap: () => increment();
child: Text('Press'),
));
});
}
我还重构了我的小部件并将 Button 作为无状态小部件提取出来以供重用。尽管确保引用的按钮订阅了具有 Counter 值的同一父提供者,并让 onTap 属性 通过 Provider<>.of
调用 increment() 函数希望这对以后的任何人都有帮助!