flutter - 无效的参数:URL文件:///Trousers中未指定主机

Question

我是新来的。
URL中的图像未显示在屏幕上。
错误是指定的URL中没有主机。我目前正在从教程中学习，但是讲师的代码运行良好，而我的却没有。请帮我，因为我是新手。
这是我的Main.dart文件:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'MyShop',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ProductsOverviewScreen(),
    );
  }
}

products_overview_screen.dart

 class ProductsOverviewScreen extends StatelessWidget { 
  final List<Product> loadedProducts = [ 
    Product(
      id: 'p1', 
      title: 'Red Shirt', 
      description: 'A red shirt - it is pretty red!', 
      price: 29.99, 
      imageUrl: 
          'https://cdn.pixabay.com/photo/2016/10/02/22/17/red-t-shirt-1710578_1280.jpg', 
    ),
    Product( `
      id: 'p2', 
      title: 'Trousers',
      description: 'A nice pair of trousers.', 
      price: 59.99, 
      imageUrl:
  'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e8/Trousers%2C_dress_%28AM_1960.022-8%29.jpg/512px-Trousers%2C_dress_%28AM_1960.022-8%29.jpg',
    ), 
    Product( 
      id: 'p3', 
      title: 'Yellow Scarf', 
      description: 'Warm and cozy - exactly what you need for the winter.', 
      price: 19.99, 
      imageUrl: 
          'https://live.staticflickr.com/4043/4438260868_cc79b3369d_z.jpg', 
    ), 
    Product(
      id: 'p4',
      title: 'A Pan',
      description: 'Prepare any meal you want.',
      price: 49.99, 
      imageUrl: 
          'https://upload.wikimedia.org/wikipedia/commons/thumb/1/14/Cast-Iron-Pan.jpg/1024px-Cast-Iron- Pan.jpg',
    ), 
  ];

  @override 
  Widget build(BuildContext context) { 
    return Scaffold( 
      appBar: AppBar( 
        title: Text('My Shop'),
      ),
      body: GridView.builder(
        padding: const EdgeInsets.all(10.0),
        itemCount: loadedProducts.length,
        itemBuilder: (ctx, i) => ProductItem(
          loadedProducts[i].id,
          loadedProducts[i].title,
          loadedProducts[i].imageUrl,
        ),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          childAspectRatio: 3 / 2,
          crossAxisSpacing: 10,
          mainAxisSpacing: 10,
        ),
      ),
    );
  }
} 

这是Product_item.dart

class ProductItem extends StatelessWidget {
  final String id;
  final String title;
  final String imageUrl;
ProductItem(this.id, this.imageUrl, this.title);
  @override
  Widget build(BuildContext context) {
    return GridTile(
      child: Image.network(
        //imageUrl
        imageUrl,
        fit: BoxFit.cover,
      ),
    );
  }
} ```

这个product.dart

class Product {
  final String id;
  final String title;
  final String description;
  final double price;
  final String imageUrl;
  bool isFavorite;

  Product({
    @required this.id,
    @required this.description,
    @required this.imageUrl,
              this.isFavorite,
    @required this.price,
    @required this.title,
  });
} ```

Answer 1

问题出在你的ProductItem类上。您尚未按照数字定义方式分配项目。

Like: ProcutItem(this.id, this.title, this.imageUrl), the item should also be passed in that same manner. No changes in that

解决方案

class ProductItem extends StatelessWidget {
  final String id;
  final String title;
  final String imageUrl;
  ProductItem(this.id, this.title, this.imageUrl);  // <---- Here is the change
  @override
  Widget build(BuildContext context) {
    return GridTile(
      child: Image.network(
        //imageUrl
        imageUrl,
        fit: BoxFit.cover,
      ),
    );
  }
}

从那以后，您已经通过这种方式在ProductOverViewScreen中传递了该项目

        // first should be id, then title, then imageURl. It should match from the above class
        ProductItem(
          loadedProducts[i].id,  
          loadedProducts[i].title,
          loadedProducts[i].imageUrl,
        )

ASSUMPTIONS
我的Product类看起来像这样，我敢肯定您可能仅以这种方式创建了该类。您的Product类在代码中不可用，因此是假设。如果需要，可以引用此代码

class Product{
  double price;
  String id, title, description, imageUrl;
  
  Product({this.price, this.id, this.title, this.description, this.imageUrl});
}

结果