如何使用提供程序过滤 flutter 中的数据

Question

如何从提供程序获取数据并在我的 flutter 应用程序中对其进行过滤

当你按下它时，这是我的分类小部件，我希望它使用 catagoryId 过滤我的数据我想将过滤后的数据传递到项目屏幕。 我怎么总是出错。 我创建了一个保存类别 ID 的方法并将其传递给设置 getOnlineItem() 方法以仅显示我匹配的他们的类别的子类别

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/container.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:onlineshoping1/Assets/colors.dart';
import 'package:onlineshoping1/screans/item.dart';
import 'package:provider/provider.dart';

import '../provider/provider.dart';

class CatagoriesCard extends StatefulWidget {
  final dynamic listt;
  const CatagoriesCard({this.listt});

  @override
  State<CatagoriesCard> createState() => _CatagoriesCardState();
}

class _CatagoriesCardState extends State<CatagoriesCard> {
  @override
  Widget build(BuildContext context) {
    dynamic catagory;

    initState() {
      OnlineShopingProvider provider =
          Provider.of<OnlineShopingProvider>(context, listen: false);

      setState(() {
        catagory = provider.datalist.where((element) {
          return element['catagory_id'] == widget.listt;
        }).toList();
      });
    }

    setCategory(catagoryId) {
      OnlineShopingProvider provider = Provider.of(context, listen: false);
      provider.setCategory(catagoryId);
    }

    return GestureDetector(
      onTap: () {
        print(widget.listt);
        Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => Item(
                    list: widget.listt['catagory_id'],
                  )),
        );
      },
      child: Container(
          width: double.infinity,
          height: 110,
          margin: EdgeInsets.only(top: 20),
          decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
              boxShadow: const [
                BoxShadow(
                  color: Colors.grey,
                  blurRadius: 5,
                  offset: Offset(0, 5),
                )
              ]),
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Row(
              children: [
                Container(
                  height: 110,
                  width: 110,
                  margin: EdgeInsets.only(right: 20),
                  decoration: BoxDecoration(
                    color: tdgrey,
                    borderRadius: BorderRadius.circular(10),
                  ),
                  child: Image.network('${widget.listt['catagory_img']}'),
                ),
                Text(
                  '${widget.listt['catagory_name']}',
                  style: TextStyle(fontSize: 15),
                ),
              ],
            ),
          )),
    );
  }
}

这是我的提供商 class

import 'dart:math';

import 'package:flutter/material.dart';
import 'package:onlineshoping1/screans/item.dart';

class OnlineShopingProvider with ChangeNotifier {
  int _selectedCategory = 0;
  final dynamic _data = [
    {
      'catagory_id': '1',
      'catagory_name': 'shoe',
      'catagory_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
    },
    {
      'catagory_id': '2',
      'catagory_name': 'clothes',
      'catagory_img':
          'https://www.freevector.com/uploads/vector/preview/1761/FreeVector-Womens-Clothes-Silhouettes.jpg',
    },
  ];

  final dynamic _item = [
    {
      'item_name': 'addidass',
      'item_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
      'price': '4000',
      'catagory_id': '1',
      'item_description':
          " is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,"
    },
    {
      'item_name': 'nike',
      'item_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
      'price': '3000',
      'catagory_id': '1',
      'item_description':
          " is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,"
    },
    {
      'item_name': 'reebok',
      'item_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
      'price': '2000',
      'catagory_id': '1',
      'item_description':
          " is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,"
    },
    {
      'item_name': 'chanel',
      'item_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
      'price': '2000',
      'catagory_id': '2',
      'item_description':
          " is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,"
    },
    {
      'item_name': 'CUCCI',
      'item_img':
          'https://thumbs.dreamstime.com/b/gadgets-accessories-gadgets-accessories-isolated-white-background-133429004.jpg',
      'price': '2000',
      'catagory_id': '2',
      'item_description':
          " is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,"
    },
  ];

  List cart = [];
  get datalist => _data;
  get items => _item;

  getOnlineItem() {
    if (_selectedCategory == null) {
      return _item;
    } else {
      return _item.where((e) => e['category_id'] == _selectedCategory).toList();
    }
  }

  void setCategory(id) {
    _selectedCategory = id;
    notifyListeners();
  }
}

Answer 1

首先，请修复语法错误，因为在_item map 中你有"catagory_id" ，而在getOnlineItem方法中你使用的是"category_id" 。 我建议您使用数据类而不是地图。

尽量不要使用dynamic ，请在可以时始终指定数据类型。

在getOnlineItem方法中，您正在检查两种不同数据类型的相等性。

return _item.where((e) => e['category_id'] == _selectedCategory).toList();

您正在比较e['category_id']这是一个String与_selectedCategory这是一个int 。 因此，您必须将_selectedCategory的数据类型更改为String或使用toString()方法。 所以你有以下代码：

  getOnlineItem() {
    if (_selectedCategory == null) {
      return _item;
    } else {
      return _item.where((e) => e['catagory_id'] == _selectedCategory.toString()).toList();
    }
  }