发生异常。 _小部件模型上的 TypeError（空检查运算符用于空值）错误

Question

这是我在主屏幕上显示缩略图或食物图像的代码。但我不知道为什么图像没有出现在我的模拟器中，并且在注释行显示 _TypeError （对空值使用空检查运算符）。

import 'package:flutter/material.dart';
import '../Model/menus.dart';

class InfoDesignWidget extends StatefulWidget {
  //this class will receive
  Menus? model;
  BuildContext? context;

  InfoDesignWidget({this.model, this.context});

  @override
  State<InfoDesignWidget> createState() => _InfoDesignWidgetState();
}

class _InfoDesignWidgetState extends State<InfoDesignWidget> {
  String? thumbnailUrl;
  @override
  Widget build(BuildContext context) {
    return InkWell(
      splashColor: Colors.amber,
      child: Padding(
        padding: const EdgeInsets.all(1.0),
        child: Container(
          height: 235,
          width: MediaQuery.of(context).size.width,
          child: Column(
            children: [
              Divider(
                height: 2,
                thickness: 3,
                color: Colors.grey[300],
              ),
              //Merchant image
              Image.network(
                widget.model!.thumbnailUrl!, //here is the error message
                height: 200.0,
                width: MediaQuery.of(context).size.width * .97,
                fit: BoxFit.cover,
              ),
              const SizedBox(height: 2.0),
              //Merchant name
              Text(
                widget.model!.menuName!,
                style: const TextStyle(
                  color: Colors.black,
                  fontSize: 20,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Divider(
                height: 2,
                thickness: 3,
                color: Colors.grey[300],
              ),
              Text(
                widget.model!.menuInfo!,
                style: const TextStyle(
                  color: Colors.black,
                  fontSize: 20,
                  fontWeight: FontWeight.w400,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

我已经尝试了很多解决方案，但仍然存在。我什至无法删除空检查，因为它是强制性的。

Answer 1

当我们不事先检查时，空断言是有风险的。你可以做的

if(widget.model?.thumbnailUrl!=null)
 Image.network(..),

您也可以使用空字符串作为默认值

Image.network(
  widget.model?.thumbnailUrl??", 
  errorBuilder: (BuildContext context, Object exception, StackTrace   stackTrace) { 
    return Text("YourImageOnError);
}

你也可以为别人做同样的事；不是关于这个问题，而是使用

MediaQuery.sizeOf

或layoutBuilder 来获取大小。