具有空安全性的 Flutter 条件渲染

Question

如果 expires 不为空，我想呈现文本小部件。所以我检查了 null

但是报错

class TileButton extends StatelessWidget {
  final DateTime? expires;

  const TileButton({
    Key? key,
    this.expires,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Text(
          'Hello Flutter',
        ),
        if (expires != null)
          Text(
            expires.day.toString(),
          ),
      ],
    );
  }
}

Answer 1

您正在使用启用了空安全的 Flutter。（如果您不熟悉这个概念，请在此处阅读 Null safety in Flutter。）

错误似乎是在抱怨表达式 expires.day.toString() 中的术语 expires 可以为 null，这在 null-safety 中是不允许的。您知道 expires 不为空，因此您可以使用 ! 断言以防止错误，如 expires!.day.toString().

注意在简单的Dart代码中，编译器检测到非空测试，不会报错，例如：

DateTime? test;
print('${test.day}');
if (test != null) {
  print('${test.day}');
}
var list = [
  test.day,
  if (test != null) test.day,
];

这里第一个和第三个打印语句有错误，第二个和第四个没有。我不知道为什么这不会贯彻到文本小部件中。

Answer 2

感谢社区中的那个人。他显示了我应该看的地方

因此此检查不适用于 class 个字段

The analyzer can’t model the flow of your whole application, so it can’t predict the values of global variables or class fields.

For a non-local variable, the compiler cannot easily make that guarantee. Non-local variables implicitly provide getter functions, which could be overridden by derived class and which could return different values from one access to the next.

另请查看此帖子评论中的 link 以获取更多信息

所以。如果我想在不使用 ! 的情况下使用 null 检查我应该创建本地 var final _expires = expires; 并使用 _expires 进行检查

class TileButton extends StatelessWidget {
  final DateTime? expires;

  const TileButton({
    Key? key,
    this.expires,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final _expires = expires;
    return Row(
      children: [
        Text(
          'Hello Flutter',
        ),
        if (_expires != null)
          Text(
            _expires.day.toString(),
          ),
      ],
    );
  }
}

具有空安全性的 Flutter 条件渲染

Flutter conditional rendering with null-safety

flutter

dart

dart-null-safety