如何使用提供程序過濾 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();
    }
  }