list - how to delete item list using pop up menu - flutter
问题描述
How do i delete an item list when i clicked on a pop up menu button? however, my list and pop up menu is in two separate files. i need to know which one im deleting according to which list item is pressed on.
pop_up_menu.dart:
import 'package:flutter/material.dart';
class PopUpMenu extends StatelessWidget {
void showMenuSelection(String value) {
print("pressed");
}
@override
Widget build(BuildContext context) {
return PopupMenuButton<String>(
padding: EdgeInsets.zero,
icon: Icon(Icons.more_vert),
onSelected: showMenuSelection,
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
const PopupMenuItem<String>(
value: 'Create another',
child: ListTile(
leading: Icon(Icons.add), title: Text('Create another'))),
const PopupMenuItem<String>(
value: 'Delete',
child: ListTile(
leading: Icon(Icons.delete), title: Text('Delete')))
],
);
}
}
So imported this pop up menu in list_tile.dart, whenever i clicked on the pop up menu button, 'Delete', i need to remove the selected list item that has pressed the pop up menu
List_tile.dart:
import 'package:flutter/material.dart';
import '../pop_up_menu/pop_up_menu.dart';
var levelsData = [];
class ListTile extends StatefulWidget {
@override
ListTileState createState() => new ListTileState();
}
class ListTileState extends State<ListTile> {
@override
Widget build(BuildContext context) {
return ListView.builder(
itemBuilder: (BuildContext context, int index) => Card(
child: SingleChildScrollView(
child: StuffInTiles(
levelsData[index]['user_id'],
levelsData[index]['price'],
),
),
),
itemCount: levelsData.length,
);
}
}
class StuffInTiles extends StatelessWidget {
final String userId;
final double price;
StuffInTiles(this.userId, this.price);
@override
Widget build(BuildContext context) {
List<dynamic> _getChildren() {
List<Widget> children = [];
levelsData.forEach(
(element) {
if (price.toString() == element['price'].toString()) {
children.add(ListTile(
title: Text("@" + element['price'].toString(),
style: TextStyle(color: Colors.lightGreen)),
subtitle: Text(
"Created on 01 Jun 2018 at 06:24AM \n when price was " +
element['price'].toString()),
trailing: PopUpMenu()));
}
},
);
return children;
}
}
}
So each item in this list has a pop up menu with delete option in that menu. When the delete option is pressed, it has to delete the item that triggered it.
Example: when the pop up menu button delete for user2 is pressed, it should delete user2.
解决方案
向您的类添加回调函数PopUpMenu
:
class PopUpMenu extends StatelessWidget {
VoidCallback onDelete;
PopUpMenu({this.onDelete});
void showMenuSelection(String value) {
switch (value) {
case 'Delete':
onDelete();
break;
// Other cases for other menu options
}
}
然后在您的原始课程中创建它时:
...
trailing: PopUpMenu(
onDelete: () {
levelsData.removeWhere((element) => element == element);
}
)));
}
Flutter 中的一般经验法则是将回调传递给子级,而不是尝试访问父级中的数据。
您可能还需要使您的StuffInTiles
Widget 有状态并添加setState(() {});
到您的 Widget 中onDelete
,因为简单地删除该值实际上不会使用新列表更新您的视图。
推荐阅读
- javascript - 弹出模式出现,但值没有更新,因为服务器端点击事件没有触发
- matlab - 导出为PDF后图中的白线
- c# - WPF C#来回移动黑白时出现错误两个组合框项目选择
- android - 未能以哈希字符串“android-O”为目标
- python - 在python中使用getattr动态映射函数名
- r-markdown - R Markdown 投影仪标题
- java - 尝试通过 JAVA 500 错误删除数据库行
- android - 如何在 Android API 24 及更高版本中接听电话?
- c# - 使用 ajax 传递时,字符串数组未正确投影
- javascript - 在跨度中包装创建的元素