Flutter:当我在提供者槽函数中更新我的列表时,我的屏幕不会更新
Flutter: My screen doesn't update when I update my List in the provider trough functions
我的主文件中有一个提供程序中包含函数的列表。如果我通过我的小部件中的功能更新此列表(通过按下按钮),它似乎可以工作但不会改变屏幕上的任何内容...
我有两个屏幕,应该用同一个列表归档,所以我需要提供者功能。
在我看来(当然不一定是正确的)我对功能进行了正确的编码,所以问题可能是屏幕没有更新,虽然我使用了消费者。如果你能告诉我代码中的错误就太好了。
如果你能看看我的问题,我会很高兴 - 谢谢!
主文件:
void main() => runApp(
MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => MyList()),
],
child: MyApp(),
),);
class MyList extends ChangeNotifier {
final List<String> heute = [
'Ereignis 1',
'Ereignis 2',
'Ereignis 3',
'Ereignis 4',
'Ereignis 5'
];
UnmodifiableListView<String> get items => UnmodifiableListView(heute);
int get totallength => heute.length;
void addItem(String item) {
heute.add(item);
notifyListeners();
}
void deleteItem(int index) {
heute.removeAt(index);
notifyListeners();
}
void removeAll() {
heute.clear();
notifyListeners();
}
}
小部件:
class ContainerListe extends StatefulWidget {
@override
_ContainerListeState createState() => _ContainerListeState();
}
class _ContainerListeState extends State<ContainerListe> {
final heute = MyList();
void addItem(String item) {
setState(() {
heute.addItem(item);});
Navigator.of(context).pop();
}
void removeAll(){setState(() {
setState(() {
heute.removeAll();});
});}
void deleteItem(int index) {
setState(() {
heute.deleteItem(index);
});}
void newEntry() {
showDialog<AlertDialog>(
context: context,
builder: (BuildContext context)
{return AddItemDialogWHW(addItem);});}
@override
Widget build(BuildContext context) {
final heute = MyList();
final elemente = heute.items;
return Consumer<MyList>(
builder: (context, mylist, child)
{
return
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
width: 400.0,
height: 550.0,
child: Align(
alignment: Alignment.bottomCenter,
child:
ListView.builder(
itemCount: Provider
.of<MyList>(context, listen: true)
.totallength,
itemBuilder: (context, i) {
return
Column(
children: [
ContainerVorlage(
elemente[i],
() => deleteItem(i),
),
SizedBox(
height: 15,
),
],
)
;
},
)
)),
SizedBox(
height: 40,
),
AddButton(
() => newEntry(),
),
]);
});
}
}
//More Code
首先,从 _ContainerListeState
中删除这一行
final heute = MyList();
然后使用 MyList
对象中的方法,您可以使用
return Consumer<MyList>(builder: (context, mylist, child)
... // rest code
ContainerVorlage(
elemente[i],
() => mylist.deleteItem(i),
),
您正在构建方法下创建新对象并将其用于添加删除操作,它与您获取长度的部分无关。
为了正确删除,请使用它:
mylist.deleteItem(i)
我的主文件中有一个提供程序中包含函数的列表。如果我通过我的小部件中的功能更新此列表(通过按下按钮),它似乎可以工作但不会改变屏幕上的任何内容...
我有两个屏幕,应该用同一个列表归档,所以我需要提供者功能。 在我看来(当然不一定是正确的)我对功能进行了正确的编码,所以问题可能是屏幕没有更新,虽然我使用了消费者。如果你能告诉我代码中的错误就太好了。
如果你能看看我的问题,我会很高兴 - 谢谢!
主文件:
void main() => runApp(
MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => MyList()),
],
child: MyApp(),
),);
class MyList extends ChangeNotifier {
final List<String> heute = [
'Ereignis 1',
'Ereignis 2',
'Ereignis 3',
'Ereignis 4',
'Ereignis 5'
];
UnmodifiableListView<String> get items => UnmodifiableListView(heute);
int get totallength => heute.length;
void addItem(String item) {
heute.add(item);
notifyListeners();
}
void deleteItem(int index) {
heute.removeAt(index);
notifyListeners();
}
void removeAll() {
heute.clear();
notifyListeners();
}
}
小部件:
class ContainerListe extends StatefulWidget {
@override
_ContainerListeState createState() => _ContainerListeState();
}
class _ContainerListeState extends State<ContainerListe> {
final heute = MyList();
void addItem(String item) {
setState(() {
heute.addItem(item);});
Navigator.of(context).pop();
}
void removeAll(){setState(() {
setState(() {
heute.removeAll();});
});}
void deleteItem(int index) {
setState(() {
heute.deleteItem(index);
});}
void newEntry() {
showDialog<AlertDialog>(
context: context,
builder: (BuildContext context)
{return AddItemDialogWHW(addItem);});}
@override
Widget build(BuildContext context) {
final heute = MyList();
final elemente = heute.items;
return Consumer<MyList>(
builder: (context, mylist, child)
{
return
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
width: 400.0,
height: 550.0,
child: Align(
alignment: Alignment.bottomCenter,
child:
ListView.builder(
itemCount: Provider
.of<MyList>(context, listen: true)
.totallength,
itemBuilder: (context, i) {
return
Column(
children: [
ContainerVorlage(
elemente[i],
() => deleteItem(i),
),
SizedBox(
height: 15,
),
],
)
;
},
)
)),
SizedBox(
height: 40,
),
AddButton(
() => newEntry(),
),
]);
});
}
}
//More Code
首先,从 _ContainerListeState
final heute = MyList();
然后使用 MyList
对象中的方法,您可以使用
return Consumer<MyList>(builder: (context, mylist, child)
... // rest code
ContainerVorlage(
elemente[i],
() => mylist.deleteItem(i),
),
您正在构建方法下创建新对象并将其用于添加删除操作,它与您获取长度的部分无关。
为了正确删除,请使用它:
mylist.deleteItem(i)