Question

我一直在寻找一些关于如何在使用 ListView.builder 时重建 FutureProvider 的好例子。我的目标是拥有一个搜索功能，我可以在其中查询 SQFlite 并返回一个将重新分配给 ListView.builder 的新列表。我的代码运行良好，但在 FutureProvider 中重建 UI 似乎不太走运。我错过了什么？

main.dart

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        FutureProvider<List<BillingData>>(
          create: (context) => BillingDataService().getBillingData(),
        ),
      ],
      child: MaterialApp(),
    );
  }
}

billing_data_service.dart

  Future<List<BillingData>> getBillingData() async{
    var dbClient = await locator.get<SQLService>().getDatabase;
    var billingData = await dbClient.rawQuery(//some query here);
    
    return billingData.map((e) => BillingData.fromDB(e)).toList();
  }


  Future<List<BillingData>> searchConcessionaire(String value) async{
    var dbClient = await locator.get<SQLService>().getDatabase;
    var searchResult = await dbClient.rawQuery(//some search query);

    return searchResult.map((e) => BillingData.fromDB(e)).toList();
  }

conssionaire_screen.dart

Widget build(BuildContext context) {
  List<BillingData> billingData = Provider.of<List<BillingData>>(context);
  return Scaffold(
      appBar: AppBar(),
      body: (billingData == null)
              ? Center(
            child: CircularProgressIndicator(),
          )
              : ListView.builder(
              itemCount: billingData.length,
              itemBuilder: (context, index) {
                return ConcessionaireCard(
                    index: index,
                    fullName: billingData[index].fullName,
                    ctName: billingData[index].ctName,
                    mtrNo: billingData[index].mtrNo,
                    prevReading: billingData[index].prevReading,
                    curReading: billingData[index].curReading,
                );
              }),
        ,
      );
}

聆听 FutureProvider 的变化

0 个答案: