在列表视图多选中设置状态后，颤振布尔值重置

Posted 2023-02-23

【中文标题】在列表视图多选中设置状态后，颤振布尔值重置

【英文标题】：Flutter bool value resets after setstate in listview multiselect

【发布时间】：2021-01-16 21:00:51

【问题描述】：

我有一个带有复选框的列表视图，其中填充了数据，当我选择选项时，它将选中该项目。 Listview 意味着是多选选项。有用于将 jsonresponse 转换为数据的模型类。 UI 代码工作正常，但 ontap 操作导致应用程序出现错误。 当点击项目被选中时，它会选中该框并自发重置。问题是关于选择它自动重置的所有项目上的复选框。模型类看起来有问题。在模拟器和物理设备上面临问题。 感谢您的时间。

这是我的 CommonResponse 类

class CommonResponse 
  final String id;
  final String name;
  bool isSelected = false;

  CommonResponse(this.id, this.name);

  factory CommonResponse.fromJson(Map<String, dynamic> json) 
    return CommonResponse(
      id: json['id'],
      name: json['name'] as String,
    );
  

这是用户界面代码：

import 'dart:convert';

import 'package:flutter/material.dart';

class WorkList extends StatefulWidget 
  Key key;

  WorkList(this.key) : super(key: key);

  @override
  _WorkListState createState() => _WorkListState();


class _WorkListState extends State<WorkList> 
  Constants constants = Constants();
  List<String> selectedPrefIdList = List();

  Future<List<CommonResponse>> _getList() async 
    var jsonData =
        '["id": "1", "name": "1-2 day", "id": "2", "name": "cameo", "id": "5", "name": "movies", "id": "6", "name": "ads"]';

    List jsonResponse = json.decode(jsonData);
    var workPrefOutput =
        jsonResponse.map((list) => CommonResponse.fromJson(list)).toList();
    return workPrefOutput;
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: SafeArea(
        child: Container(
          child: FutureBuilder<List<CommonResponse>>(
            future: _getList(),
            builder: (context, snapshot) 
              if (snapshot.hasData) 
                return ListView.separated(
                    separatorBuilder: (context, index) 
                      return Divider();
                    ,
                    itemCount: snapshot.data.length,
                    itemBuilder: (context, index) 
                      return CheckboxListTile(
                        title: Text(snapshot.data[index].name),
                        controlAffinity: ListTileControlAffinity.platform,
                        value: snapshot.data[index].isSelected,
                        onChanged: (value) 
                          setState(() 
                            snapshot.data[index].isSelected = value;
                            var selectedId = snapshot.data[index].id;
                            selectedPrefIdList.contains(selectedId)
                                ? selectedPrefIdList.remove(selectedId)
                                : selectedPrefIdList.add(selectedId);
                            // print(selectedPrefIdList);
                          );
                        ,
                      );
                    );
               else 
                return Center(
                  child: CircularProgressIndicator(),
                );
              
            ,
          ),
        ),
      ),
    );
  

【问题讨论】：

我没有完全理解你的问题。在您的模型类中，还存储所有列表的布尔值。让 bool 值默认为 false，您可以在选中该特定复选框后将其设置为 true。

【参考方案1】：

我不确定这是否可行，但也许你可以尝试切换它

snapshot.data[index].isSelected = value;

到这里

snapshot.data[index].isSelected = !snapshot.data[index].isSelected;

【参考方案2】：

我猜 setstate 正在制造一个问题。它正在重新加载未来的构建器。 因此，您的选择正在重置

【讨论】：

那么现在该怎么办？

使用 bloc/provider 代替 FutureBuilder 来获取新数据。或者，使用 ValueNotifier 更新屏幕而不是未来的构建器