flutter - Flutter 提供者消费者删除了我的项目

问题描述

我正在尝试构建一个排序函数来对 JSON 数据进行排序。为此，我有一个打开“showModalBottomSheet”的按钮。

在其中我可以选择以下学校班级编号的数据。所以在我的数据中，当我加载我的构造函数时，我有 6 个教室。

如果过滤器包含教室的编号，则我的过滤器由是否处于活动状态的按钮表示。我的代码工作得很好，我的问题是当我选择一个过滤器按钮以激活或不激活过滤器时，该按钮被删除而不是保留但改变颜色

我的通知者：

class TablesNotifier with ChangeNotifier {

  // Services
  // ---------------------------------------------------------------------------
  final jsonSelectorService = locator<JsonSelectorService>();

  // Variables
  // ---------------------------------------------------------------------------
  //all data from my classerooms in JSON
  List<ClassroomModel> classrooms;
  // Data that I will display and reconstruct based on my filter parameters
  List<ClassroomModel> classroomsFiltered; 
  List<int> numberOfClassrooms = List(); 
  // Model which will store the parameters of my filters and as a function I will load the data to display
  FilterClassroomsModel filterClassroomsModel = FilterClassroomsModel();

  // Constructor
  // ---------------------------------------------------------------------------

  TablesNotifier(){
    _initialise();
  }

  // Initialisation
  // ---------------------------------------------------------------------------
  Future _initialise() async{
    classrooms = await jsonSelectorService.classrooms('data');
    classroomsFiltered = classrooms ;

    // I install the number of existing classrooms
    // Here the result is [1,2,3,4,5,6]
    classrooms.forEach((element) {
      if(!numberOfClassrooms.contains(element.type)){
        numberOfClassrooms.add(element.type);
      }
    });

    // I install the number of classrooms activated by default in my filter
    // As I decide to display all my classrooms by default
    // My filter on the classrooms must contain all the loaded classrooms
    filterClassroomsModel.classrooms = numberOfClassrooms;
    notifyListeners();
  }

  // Functions public
  // ---------------------------------------------------------------------------
  void saveClassroomsSelected(int index)
  {
    // Here my classroom model also contains the numbers of the classrooms that I want to filter
    if(filterClassroomsModel.classrooms.contains(index)){
      filterClassroomsModel.classrooms.remove(index);
    }else{
      filterClassroomsModel.classrooms.add(index);
    }
    notifyListeners();
  }
}

我已经确定在我的函数初始化（）中，如果我通过这个更改我的代码，它可以工作：

filterClassroomsModel.classrooms= numberOfClassrooms; // this
filterClassroomsModel.classrooms= [1,2,3,4,5,6]; // By this

我正在失去课堂计算的动态方面，这不适合我。但我不明白这种行为。

我的观点：

class TableScreen extends StatelessWidget {
  final String title;
  TableScreen({Key key, @required this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      drawer: MenuDrawerComponent.builder(context),
      appBar: AppBar(
        backgroundColor: AppColors.backgroundDark,
        elevation: 0,
        centerTitle: true,
        title: Text(title),
      ),
      floatingActionButton: FloatingActionButton.extended(
        icon: Icon(Icons.sort),
        label: Text('Filter'),
        onPressed: () async{
          slideSheet(context);
        },
        backgroundColor: AppColors.contrastPrimary,
      ),
      body: _buildBody(context),
    );
  }

  Widget _buildBody(BuildContext context)
  {
    var _tableProvider = Provider.of<TablesNotifier>(context);

    if(_tableProvider.chargesFiltered == null){
      return Center(
        child: CircularProgressIndicator(
          backgroundColor: AppColors.colorShadowLight,
        ),
      );
    }else{
      return Column(
        children: <Widget>[
          Expanded(
            child: Container(
              padding: EdgeInsets.only(top: 10, right : 20, left : 20),
              child: ListView.builder(
                itemCount: _tableProvider.classroomsFiltered.length,
                itemBuilder: (context, index){
                  return Container(
                    child: Column(
                      children: [
                        Row(
                            // Some classrooms data
                        ),
                      ],
                    ),
                  );
                },
              ),
            )
          ),
        ],
      );
    }
  }

  void slideSheet(BuildContext context) {
    var _tableProvider = Provider.of<TablesNotifier>(context, listen:false);

    showModalBottomSheet(
        context: context,
        isScrollControlled: true,
        isDismissible: true,
        builder: (context) {
          return Wrap(
            children: [
              Container(
                color: Color(0xFF737373),
                child: Container(                 
                  child: Column(
                    children: <Widget>[
                      // Some filters ...
                      // Here I want to rebuild the list of button for show the changes
                      ChangeNotifierProvider.value(
                        value: _tableProvider,
                        child: Consumer<TablesNotifier>(
                            builder: (context, model, child){
                              return _listOfClassrooms(context);
                            }
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ]
          );
        });
  }

  Widget _listOfClassrooms(BuildContext context){
    var _tableProvider = Provider.of<TablesNotifier>(context);

    List<Widget> list = List<Widget>();
    var listClassrooms = _tableProvider.numberOfClassrooms;
    var filterClassrooms = _tableProvider.filterClassroomsModel.classrooms;

    for (var i = 0; i < listClassrooms.length; i++) {
      int selectIndex = 0;
      if(filterClassrooms.contains(listClassrooms[i])){
        selectIndex = listClassrooms[i];
      }

      list.add(
        RadioComponent(
            text: "${listClassrooms[i]}",
            index: listClassrooms[i],
            width: (MediaQuery.of(context).size.width - 56) /3,
            selectedIndex: selectIndex,
            onPressed: _tableProvider.saveChargesSelected,
          ),
      );
    }
    return Wrap(
        spacing: 8.0, // gap between adjacent chips
        runSpacing: 8.0, // gap between lines
        children: list
    );
  }
}

我的 FilterClassroomsModel ：

class FilterClassroomsModel {
  int order;
  int sort;
  List<int> classrooms;

  FilterClassroomsModel ({
    this.order = 0,
    this.sort = 0,
    this.classrooms = const[], 
  });

  @override
  String toString() {
    return '{ '
        '${this.order}, '
        '${this.sort}, '
        '${this.classrooms}, '
        '}';
  }
}

编辑：已解决的主题。感谢 Javachipper。在通知程序中，我将其替换为：

filterClassroomsModel.classrooms = numberOfClassrooms;

通过那个：

filter.classrooms = List<int>();
filter.classrooms.addAll(numberOfClassrooms);

标签： flutterdart

flutter - Flutter 提供者消费者删除了我的项目

问题描述

解决方案

推荐阅读