無法加載資產（圖像）顫振

Question

這是我的 API 代碼，我正在將圖像路徑從這里傳遞到顫振中以確定要加載的圖像。 但是，所有其他數據（例如價格或標題）正在加載，但圖像未加載並拋出無法加載資產的錯誤。

app.post('/products',(req,res)=>{
    //console.log(req.body.LanguageID);
    //console.log(req.body.CategoryID);
    console.log(req.body);
    res.status(200).json({
        "StatusCode": 200,
        "StatusMessage": "success",
        "Data": [
            {
                "Id": "p8",
                "title": "Sufiyan",
                "ImageAsset": "assets/images/plant3.png",
                "price": 80.0                
            },
            {
                "Id": "p8",
                "title": "Sufiyan",
                "ImageAsset": "assets/images/plant1.png",
                "price": 90.0
            }
        ],
        "Message": null,
        // "localId": '8',
        // "idToken": '',
        // "error": {
        //     "message": ""
        // },
        // "expiresIn": "9"
    });
});
app.listen(5000);

這就是我將數據從提供程序加載到小部件中的方式，並且無法理解為什么這不起作用，因為我是新手，無法理解它。

@override
void initState() {
    // TODO: implement initState
    super.initState();
    //gettingData();

    final productData = Provider.of<Products>(context, listen: false);
    productData.fetchData(context);
    // Create TabController for getting the index of current tab
    _controller = TabController(length: list.length, vsync: this);
    _containerheight = _totalarrayheight(8) * 140;
}

@override
Widget build(BuildContext context) {
    final productData = Provider.of<Products>(context);
    final products = productData.items;
    final featuredProducts = productData.featuredItems;

    _controller!.addListener(() {
      setState(() {
        _selectedIndex = _controller!.index;
        if (_controller!.index == 0) {
          _containerheight =
              140 * _totalarrayheight(products.length.toDouble());
        } else {
          _containerheight =
              140 * _totalarrayheight(featuredProducts.length.toDouble());
        }
      });
      if (kDebugMode) {
        print("Selected Index: " + _controller!.index.toString());
      }
    });

那是我的提供者代碼：

class Products with ChangeNotifier {
    late List<ProductList> _items = [];
    fetchData(context) async {
    _items = await getData();
    notifyListeners();
}

為產品創建網格的小部件

class NewProductGrid extends StatelessWidget {
    const NewProductGrid({
    Key? key,
    required this.products,
    }) : super(key: key);

    final List<ProductList> products;

    @override
    Widget build(BuildContext context) {
    return StaggeredGridView.countBuilder(
      padding: EdgeInsets.only(right: 30, left: 10, top: 10),
      physics:
          NeverScrollableScrollPhysics(), // to disable GridView's scrolling
      shrinkWrap: false,
      crossAxisCount: 4,
      itemCount: products.length,
      itemBuilder: (BuildContext context, int index) => GestureDetector(
        onTap: () {
          Navigator.of(context).pushNamed(ProductDetail.routeName,
              arguments: {'id': products[index].id});
        },
        child: Container(
          //padding: EdgeInsets.only(left:40.0),
          child: Column(
            children: <Widget>[
              Stack(
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(left: 35.0),
                    child: Container(
                      height: 150,
                      width: 150,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(20),
                        color: primary_background_six,
                      ),
                    ),
                  ),
                  Container(
                      child: Image.asset(
                    "${products[index].imageAsset}",
                    fit: BoxFit.cover,
                  )),
                  Container(),
                ],
              ),
              Padding(
                padding: const EdgeInsets.only(left: 20.0),
                child: Text(
                  "\$${products[index].price.toInt()}",
                  style: TextStyle(fontFamily: 'Morganite Light', fontSize: 50),
                ),
              ),
              Padding(
                padding: const EdgeInsets.only(left: 20.0),
                child: Text(
                  "${products[index].title}",
                  style: TextStyle(fontFamily: 'PlayFairDisplay', fontSize: 18),
                ),
              ),
            ],
          ),
        ),
      ),
      staggeredTileBuilder: (int index) =>
          StaggeredTile.count(2, index.isEven ? 3 : 3),
      mainAxisSpacing: 4.0,
      crossAxisSpacing: 4.0,
     );
     }
}

調用小部件的屏幕代碼。

Container(
    height: _containerheight,
    child: TabBarView(
    controller: _controller,
    children: <Widget>[
    Container(
    //height: 140.0 * _totalarrayheight(tagObjs.length.toDouble()),
          child: NewProductGrid(
          products: products),
         )

產品列表型號代碼：

import 'package:flutter/material.dart';

class ProductList with ChangeNotifier {
    final String id;
    final String title;
    final String imageAsset;
    final num price;
    bool isFavorite;

    ProductList({
     required this.id,
     required this.title,
     required this.price,
     required this.imageAsset,
     this.isFavorite = false,
     });
    factory ProductList.fromMap(Map<String, dynamic> json) {
    return ProductList(
        id: json['id'],
        title: json['title'],
        imageAsset: json['imageAsset'],
        price: json['price']);
     }
    factory ProductList.fromJson(Map<String, dynamic> json) {
    print('Json:');
    print(json);
    return ProductList(
        id: json['id'] ?? '',
        title: json['title'] ?? '',
        imageAsset: json['imageAsset'] ?? '',
        price: json['price'] ?? 0);
    }

    void toggleFavoriteStatus() {
    isFavorite = !isFavorite;
    notifyListeners();
    }
}

Answer 1

響應的圖像資產具有大寫字母 i，產品列表模型具有小寫字母 i 的圖像資產

把模型改成這個

import 'package:flutter/material.dart';

 class ProductList with ChangeNotifier {
final String id;
final String title;
final String imageAsset;
final num price;
bool isFavorite;

ProductList({
 required this.id,
 required this.title,
 required this.price,
 required this.imageAsset,
 this.isFavorite = false,
 });
factory ProductList.fromMap(Map<String, dynamic> json) {
return ProductList(
    id: json['id'],
    title: json['title'],
    imageAsset: json['ImageAsset'],
    price: json['price']);
 }
factory ProductList.fromJson(Map<String, dynamic> json) {
print('Json:');
print(json);
return ProductList(
    id: json['id'] ?? '',
    title: json['title'] ?? '',
    imageAsset: json['ImageAsset'] ?? '',
    price: json['price'] ?? 0);
}

void toggleFavoriteStatus() {
isFavorite = !isFavorite;
notifyListeners();
}
}