Блог

Здравствуйте, у меня есть один вопрос: я извлекал категории из api, который отлично работает в postman, но на flutter я не использовал класс модели, просто используя dio, мне нужно получить этот json api в виде массива для вертикальной прокрутки категорий в верхней строке.

вот мой ответ postman

 {
    "data": [
        {
            "id": 1,
            "name": "Electronics",
            "color": "#ff8000"
        },
        {
            "id": 2,
            "name": "SpareParts",
            "color": "#00ff40"
        },
        
    ]
}
  

и в flutter я использовал

 getCatagories() async {
    var tokens;

    var dioo = Dio();
    dioo.interceptors
        .add(InterceptorsWrapper(onRequest: (RequestOptions options) async {
      var customHeaders = {
        'content-type': 'application/json',
      };
      options.headers.addAll(customHeaders);
      return options;
    }));

    var response = await dioo.get("https://www.mywebiste.com/api/cat");
    if(response.data.isEmpty||response.data==null)
    {
    }
    else
    {

    }

    return response.data;


  }
  

для извлечения этих категорий
я использовал

 List categories = [];

  @override
  void initState() {
   getCatagories().then((data) {
      setState(() {
         categories = data;
      });
    });
    super.initState();
  }


  // by default first item will be selected


  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: kDefaultPadding / 2),
      height: 30,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: categories.length,
        itemBuilder: (context, index) => GestureDetector(
          onTap: () {
            Fluttertoast.showToast(
                msg: "This is Center Short Toast" selectedIndex.toString(),
                toastLength: Toast.LENGTH_SHORT,
                gravity: ToastGravity.CENTER,
                timeInSecForIosWeb: 1,
                backgroundColor: Colors.red,
                textColor: Colors.white,
                fontSize: 16.0
            );
            setState(() {
              selectedIndex = index;
            });
          },
          child: Container(
            alignment: Alignment.center,
            margin: EdgeInsets.only(
              left: kDefaultPadding,
              // At end item it add extra 20 right  padding
              right: index == categories.length - 1 ? kDefaultPadding : 0,
            ),
            padding: EdgeInsets.symmetric(horizontal: kDefaultPadding),
            decoration: BoxDecoration(
              color: index == selectedIndex
                  ? Colors.white.withOpacity(0.4)
                  : Colors.transparent,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Text(
              categories[index],
              style: TextStyle(color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
  

поэтому, когда я запускаю эти категории приложений, они не отображаются для полосы прокрутки, и ошибка является необработанным исключением: InternalLinkedHashMap<String, dynamic>’ не является подтипом типа ‘List

Вы получаете данные из запроса в виде карты и присваиваете их списку. вы должны создать категории в виде карты:

 Map categories;
  

Примечание: не давайте ему обобщений.

после этого у вас возникнут некоторые проблемы в приведенном ниже коде при циклическом переходе по категориям. Это другой вопрос. 🙂