如何让消费者收听颤动中的多个参数？

Question

我需要让消费者小部件根据布尔值聆听多个变量。

this is the model class

    class Lawyer{
  Data? data;
  double? distance = 0;

  Lawyer({this.data, this.distance});

  factory Lawyer.fromJson(Map<String, dynamic> json) =>
      Lawyer(data: Data.fromJson(json['listing_data']));
}

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

class Data{
  String? title;
  String? email;
  String? phone;
  Location? location;
  List<String>? logo;
  List<String>? cover;

  Data({this.title, this.email, this.phone, this.logo, this.cover, this.location});

  factory Data.fromJson(Map<String, dynamic> json) {
    var logo = json['_job_logo'];
    var cover = json['_job_cover'];
    var long = json['geolocation_long'];
    var lat = json['geolocation_lat'];

    return Data(title: json['_job_tagline'], email: json['_job_email'],
        location: Location(latitude: json['geolocation_lat'], longitude: json['geolocation_long']),
        phone: json['_job_phone'], logo: List<String>.from(logo),
        cover: List<String>.from(cover)
    );
  }
}

这是视图模型通知器

    class LawyerAPIServices extends ChangeNotifier{
      final url = "https://dalilvision.com/wp-json/wp/v2/job_listing";      
List<Lawyer> lawyersList = [];
      List<Lawyer> staticLawyersList = [];
    
      Future<List<Lawyer>> fetchLawyers() async{
        final response = await get(Uri.parse(url.toString()));
        if(response.statusCode == 200){
          var dynamicLawyersList = jsonDecode(response.body);
          print('$dynamicLawyersList');
          lawyersList = List<Lawyer>.from(dynamicLawyersList.map((x) => Lawyer.fromJson(x)));
          staticLawyersList = lawyersList;
          lawyersList.forEach((element) {print('all lawyers: ${element.data!.location}');});
          notifyListeners();
          return lawyersList;
        }
        else{
          notifyListeners();
          throw Exception(response.statusCode);
        }
      }
    
      Future<List<Lawyer>> getFullListOfLawyers() async {
        notifyListeners();
        print('fulll list: ${staticLawyersList.length}');
        return staticLawyersList;
      }
    }

，最后是

    Consumer<LawyerAPIServices>(
                        builder: (context, value, child) => FutureBuilder(
                          future: _list,
                          builder: (BuildContext context, AsyncSnapshot<List<Lawyer>> snapshot) {
                            if (snapshot.hasData){
                              return ListView.separated(
                                  physics: const NeverScrollableScrollPhysics(),
                                  scrollDirection: Axis.vertical,
                                  shrinkWrap: true,
                                  separatorBuilder: (context, index) => const Divider(color: Colors.transparent),
                                  itemCount: value.lawyersList.length,
                                  itemBuilder: (context, index) {
                                    return InkWell(
                                      child: LawyerWidget(
                                          title: snapshot.data![index].data!.title!,
                                          email: snapshot.data![index].data!.email!,
                                          phone: snapshot.data![index].data!.phone!,
                                          logo: snapshot.data![index].data!.logo![0],
                                          cover: snapshot.data![index].data!.cover![0]
                                      ),
                                    );
                                  }
}
                              );
                            }
                            else if(snapshot.hasError){
                              return Center(
                                  child: Text(snapshot.error.toString())
                              );
                            }
                            else {
                                return const CircularProgressIndicator(
                                  strokeWidth: 2,
                              );
                            }
                          },
                        ),
                      )

Notifier class中的消费者小部件，有两个列表，staticlawyerlist从网络调用获得列表然后用作备份列表时仅初始化一次，而LawyersList是将要操纵的列表。

到目前为止，我所做的是通过网络调用获得LawyerSlist的初始值，然后以某种方式staticlawyerslist值始终等于lawyerslist ，即使我进行了任何更改或操纵LawyerSlist这些更改也会自动反映staticlawyerslist，这确实很奇怪。

现在，我要确切地实现的目的是应用条件，根据此条件，使用适当的列表更新UI。

if(setByPosition == false){
//update UI with `staticLawyersList`
}
else {
//update UI with `lawyersList` 
}

更新！！！！！！！！

这是我更新消费者的方式

CheckboxListTile(
              activeColor: Colors.black,
              value: isChecked,
              onChanged: (value) async {
                saveSharedPreferences(value: value!);
                if(value == true) {
                  Provider.of<LawyerAPIServices>(context, listen: false).sortLawyersList(
                      devicePosition: widget.position, lawyersList: widget.list);
                }
                else{
                  Provider.of<LawyerAPIServices>(context, listen: false).getFullListOfLawyers();// the list returned by this function don't applied to the consumer
                }
                setState(() {
                  isChecked = value;
                  Navigator.pop(context);
                });
              },
              title: const Text('Filter by distance'),
            ),

Answer 1

需要考虑的几件事：

1. 当您执行此“ staticlawyerslist = LawyerSlist”时，您实际上有两个“指针”到同一列表中。它适用于列表，集合，类等的方式。只有基本类型为int，double，字符串才真正复制。
   您可以使用此方法：“ staticlawyerslist = list.from（LawyerSlist）;”

2. 似乎您不需要律师服务中的changeNotifier。您可以在需要它的小部件中创建一个律师事务所的实例，并致电Fetchlawyers。如果您不希望多次重建列表，请在状态Fullwidget的初始化中进行。在您的构建方法中，使用FutureBuilder阅读未来并决定在UI中显示的内容。

    class _MyWidget extends State<MyWidget> {
      late final LawyerAPIServices lawyerApi;
    
      // Create this variable to avoid calling fetchLawers many times
      late final Future<List<Lawyer>> lawyersList;
    
      @override
      void initState() {
        super.initState();
        // Instantiate your API
        lawyerApi = LawyerAPIServices();
    
        // This will be called only once, when this Widget is created
        lawyersList = lawyerApi.fetchLawyers();
      }
    
      @override
      Widget build(BuildContext context) {
        return FutureBuilder<List<Lawyer>>(
          future: lawyersList,
          builder: ((context, snapshot) {
            switch (snapshot.connectionState) {
              case ConnectionState.done:
                if (setByPosition) {
                  //update UI with `lawyersList`
                  return _listView(snapshot.data!);
                } else {
                  //update UI with `staticLawyersList`
                  // Since the Future state is Complete you can be sure that
                  // the staticLawyersList variable in your API was already set
                  return _listView(lawyerApi.staticLawyersList);
                }
              case ConnectionState.none:
                return const Text('Error');
              default:
                return const CircularProgressIndicator.adaptive();
            }
          }),
        );
      }
    
      Widget _listView(List<Lawyer> lawyersList) {
        return ListView.separated(
            physics: const NeverScrollableScrollPhysics(),
            scrollDirection: Axis.vertical,
            shrinkWrap: true,
            separatorBuilder: (context, index) =>
                const Divider(color: Colors.transparent),
            itemCount: lawyersList.length,
            itemBuilder: (context, index) {
              return InkWell(
                child: LawyerWidget(
                    title: lawyersList[index].data!.title!,
                    email: lawyersList[index].data!.email!,
                    phone: lawyersList[index].data!.phone!,
                    logo: lawyersList[index].data!.logo![0],
                    cover: lawyersList[index].data!.cover![0]),
              );
            });
      }
    }

3. 如果出于任何原因，您需要在多个小部件上共享相同的Lawyerapiservices，则可以将其实例化在树的顶部，并使用提供商或作为参数将其发送给。

4. getfulllistoflawyers的方法不需要返回未来，因为staticlawyerslist是列表（不是未来）。您可以使用“ Lawyerapiservices.staticlawyerslist”直接获得此列表，或者可能是这样有意义的：

   未来＆lt; list＆gt; getfulllistoflawyers（）async {
   如果（staticlawyerslist.isempty）{
   等待fetchlawyers（）;
   }
   print（'Fulll列表：$ {staticlawyerslist.length}'）;
   返回Future.Value（staticlawyerslist）;
   }

Answer 2

正如 @saichi-okuma所说，要复制列表的内容，您应该使用staticlawyerslist = list.from（lawyerSlist），因为在DART和大多数Java编译器编程语言中， = lawyerslist 这意味着您是通过staticlawyerslist引用LawyerSlist。
然后，我可以在lawyerslist上操纵staticlawyerslist，

lawyersList.clear();
lawyersList.addAll(staticLawyersList);

但是当我这样做时，消费者没有根据staticlawyerslist 尽管logcat显示staticlawyerslist长度是我想要的（无过滤的完整列表）。

我的问题的结论可以用两点列出：

1-消费者仅收听一个列表lawyerslist，我认为它仍然存在。
2- @saichi-okuma提到的指针问题。

这是完整的代码更改

void getFullListOfLawyers() {
lawyersList.clear(); // to make sure that the list is clean from older operations
lawyersList.addAll(staticLawyersList);// the trick
notifyListeners();

}

Future<List<Lawyer>> fetchLawyers() async{
final response = await get(Uri.parse(url.toString()));
if(response.statusCode == 200){
  var dynamicLawyersList = jsonDecode(response.body);
  print('$dynamicLawyersList');
  lawyersList = List<Lawyer>.from(dynamicLawyersList.map((x) => Lawyer.fromJson(x)));
  staticLawyersList = List.from(lawyersList);// use this statment instead of staticLawyersList = lawyersList
  lawyersList.forEach((element) {print('all lawyers: ${element.data!.location}');});
  notifyListeners();
  return lawyersList;
}
else{
  notifyListeners();
  throw Exception(response.statusCode);
}

}

Answer 3

每当您拨打NotifyListeners时，消费者小部件都会重建，无论列表的状态如何。

也许您无法访问所消耗的API实例。确保您使用的是消费者构建器的第二个参数。

    Consumer<LawyerAPIServices>(builder: (context, lawyerAPI, child) => 
        FutureBuilder(
          future: lawyerAPI.fetchLawyers(),
            builder: ((context, snapshot) {
            switch (snapshot.connectionState) {
              case ConnectionState.done:
                if (setByPosition) {
                  //update UI with `lawyersList`
                  return _listView(snapshot.data!);
                } else {
                  //update UI with `staticLawyersList`
                  // Since the Future state is Complete you can be sure that
                  // the staticLawyersList variable in your API was already set
                  return _listView(lawyerAPI.staticLawyersList);
                }
              case ConnectionState.none:
                return const Text('Error');
              default:
                return const CircularProgressIndicator.adaptive();
            }
          }),

我认为您不需要下面的代码来满足这种特殊需求。它覆盖了您的律师列表，即使没有真正改变，也会通知所有听众。只需直接访问您的staticlawyerslist，因为当您打电话给fetchlawyers时，它就会填充。

void getFullListOfLawyers() {
lawyersList.clear(); // to make sure that the list is clean from older operations
lawyersList.addAll(staticLawyersList);// the trick
notifyListeners();
}