当我试图从列表视图中删除时，listtile 项目重新出现

Question

我在 flutter 工作了几个月。我在 Listview 项中遇到问题，当我使用 removeWhere 函数从 snapshot.data 中删除一个 listtile 项时，它会在一秒钟内重新出现。谁能帮忙从快照中永久隐藏 listtile 项目。

看看它是如何重新出现的 ->:

这是我的代码片段

import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:need/credentials.dart';
import 'package:need/models.dart';
import 'package:need/shop/need_details_shop.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:http/http.dart' as http;

class shopOrders extends StatefulWidget {
  const shopOrders({Key key}) : super(key: key);

  @override
  _shopOrdersState createState() => _shopOrdersState();
}

class _shopOrdersState extends State with AutomaticKeepAliveClientMixin {
  Future _updateStatus(String orderId, String orderStatus) async {
    String uri = '$domain/shop/order/status/$orderId/$orderStatus';
    var response = await http.put(uri, headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    });

    if (response.statusCode == 200) {
      print("sucess");

    } else {
      print("failed");
    }
  }

  Future<List<Orders>> _fetchShopOrders() async {
    SharedPreferences preferences = await SharedPreferences.getInstance();
    var sid = preferences.getString('shop_id');
    String uri = '$domain/shop/order/view/$sid';
    var response = await http.get(uri);

    if (response.statusCode == 200) {
      final items = json.decode(response.body).cast<Map<String, dynamic>>();
      List<Orders> listOfOrders = items.map<Orders>((json) {
        return Orders.fromJson(json);
      }).toList();

      return listOfOrders;
    } else {
      throw Exception('Failed to load internet');
    }
  }

  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
        body: SingleChildScrollView(
            child: Center(
                child: Column(children: <Widget>[
      Container(
          child: FutureBuilder<List<Orders>>(
        future: _fetchShopOrders(),
        builder: (context, snapshot) {
          if (!snapshot.hasData)
            return Center(child: CircularProgressIndicator());

          return ListView(
            scrollDirection: Axis.vertical,
            shrinkWrap: true,
            primary: false,
            children: snapshot.data
                .map((order) => Card(
                        child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Container(
                            height: 130,
                            width: 130,
                            child: Container(
                              color: Colors.grey,
                              child: Image(
                                  image: NetworkImage(order.product_photo),
                                  fit: BoxFit.fill),
                            )),
                        SizedBox(
                          width: 20,
                        ),
                        Container(
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceAround,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Text(order.product_title.toUpperCase()),
                              Text("Price  " + order.product_price),
                              Text("Status" + " ..."),
                              Text(order.ordered_date),
                              Row(
                                children: [
                                  IconButton(
                                      icon: Icon(Icons.check,
                                          color: Colors.green),
                                      onPressed: () {
                                        String oid = order.order_id;
                                        String status = "delivered";
                                        _updateStatus(order.order_id, status);
                                        setState(() {
                                          snapshot.data.removeWhere(
                                              (order) => order.order_id == oid);
                                        });
                                      }),
                                  IconButton(
                                      icon:
                                          Icon(Icons.close, color: Colors.pink),
                                      onPressed: () {
                                        String oid = order.order_id;
                                        String status = "cancled";
                                        _updateStatus(order.order_id, status);
                                        setState(() {
                                          snapshot.data.removeWhere(
                                              (order) => order.order_id == oid);
                                        });
                                      })
                                ],
                              )
                            ],
                          ),
                        )
                      ],
                    )))
                .toList(),
          );
        },
      ))
    ]))));
  }
}

Answer 1

这个问题的发生是因为每次你删除一个项目时 UI 都会再次重建，这意味着 FutureBuilder 会再次重建，触发 API 请求导致项目被带回，在这种情况下，我会做的是在 initstate 中调用 API 请求并保存响应，然后基于它构建 UI ，甚至可能添加一个 bool，它在 Future 加载时变为 true和假的时候。完成了，我很乐意进一步提供帮助，但我会让你先自己尝试一下。

编码愉快！

当我试图从列表视图中删除时，listtile 项目重新出现

listtile item is reappearing when i tried to remove form the listview

javascript

flutter

flutter-animation