颤动从列表视图和数据库中删除和更新项目

Question

我想同时使用这样的滑动从 listview 和 db 中删除一个条目：

 onPressed: () {
      // Delete the item from DB 
      setState(() {
      data.indexOf(data[index]);
      data.removeAt(index);
      });
     Navigator.of(context).pop();
     },

该方法似乎不起作用，我也需要有关如何在没有用户重新打开页面的情况下触发此页面上的更新的帮助。

return ListView.builder(
                      itemCount: snapshot.data.length,
                      itemBuilder: (context, index) {
                        List<Ia> data = snapshot.data;
                        print(data);
                        return Dismissible(
                          background: slideRightBackground(),
                          secondaryBackground: slideLeftBackground(),
                          key: Key(data[index].toString()),
                          // ignore: missing_return
                          confirmDismiss: (direction) async {
                            if (direction == DismissDirection.endToStart) {
                              final bool res = await showDialog(
                                  context: context,
                                  builder: (BuildContext context) {
                                    return AlertDialog(
                                      content: Text(
                                          "Are you sure you want to delete                                   `                                              ${data[index]}?"),`
                                      actions: <Widget>[
                                        // ignore: deprecated_member_use
                                        FlatButton(
                                          child: Text(
                                            "Cancel",
                                            style:
                                                TextStyle(color: Colors.black),
                                          ),
                                          onPressed: () {
                                            Navigator.of(context).pop();
                                          },
                                        ),
                                        FlatButton(
                                          child: Text(
                                            "Delete",
                                            style: TextStyle(color: Colors.red),
                                          ),
                                          onPressed: () {
                                            // Delete the item from DB 
                                            setState(() {
                                              data.indexOf(data[index]);
                                              data.removeAt(index);
                                            });
                                            Navigator.of(context).pop();
                                          },
                                        ),
                                      ],
                                    );
                                  });
                              return res;
                            } else {
                              // Navigate to edit page;
                            }
                          },
                          child: Card(
                            child: ListTile(
                              title: Text(data[index].name,
                                  style: TextStyle(fontSize: 16)),
                              subtitle: Row(
                                children: [
                                  Text(
                                    "Status",
                                    style: TextStyle(
                                        fontSize: 12,
                                        fontWeight: FontWeight.bold),
                                  ),
                                  SizedBox(
                                    width: 5,
                                  ),
                                  Text(
                                    data[index].state,
                                    style: TextStyle(
                                      color: Colors.lightBlue,
                                      fontSize: 12,
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ),
                        );
                      });

/////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// //////////////

Answer 1

现在您只是将其从列表中删除，这是毫无意义的，因为流来自数据库。您只需将其从数据库中删除。 在您的 onPressed() 中，删除 setState() 并添加：

await _fireStoreInstance.runTransaction(
      (Transaction transaction) async {
        transaction.delete(YOUR_DOC_REF_HERE); // i'd assume data[index].reference
      },
    

Answer 2

dismiss 中调用 API 应该可以工作，如果您使用 api 从服务器数据库中删除数据，则需要调用删除函数

示例 UI 代码

class MyAppState extends State<MyApp> {
  final items = List<String>.generate(20, (i) => 'Item ${i + 1}');

  @override
  Widget build(BuildContext context) {
    final title = 'Dismissing Items';

    return MaterialApp(
      title: title,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: ListView.builder(
          itemCount: items.length,
          itemBuilder: (context, index) {
            final item = items[index];
            return Dismissible(
              key: Key(item),
              
              // what to do after an item has been swiped away.
              onDismissed: (direction) {
                // Remove the item from the data source.
                setState(() {
                 Deletedata(pass your id here);
                  items.removeAt(index);
                });

                // Then show a snackbar.
                ScaffoldMessenger.of(context)
                    .showSnackBar(SnackBar(content: Text('$item deleted')));
              },
              // Show a red background as the item is swiped away.
              background: Container(color: Colors.red),
              child: ListTile(title: Text('$item')),
            );
          },
        ),
      ),
    );
  }
}

删除函数

Future<void> Deletedata(String id) async{

var response = await http.delete(Uri.parse("http://xxx.xx.xx.xx/api/delete_route/$id"), headers: {'Content-Type': 'application/json;charset=UTF-8', 'Charset': 'utf-8', 'Authorization': 'token',},);
      print('Response status: ${response.statusCode}');
      print('Response body: ${response.body}');
}