Flutter空安全下如何返回空Widget？动态页面设计遇阻

一、解决BasePage中pageUI()返回null的空安全问题 #

空安全规则下，Widget类型不允许返回null，用!断言强行返回null!本质是欺骗编译器，运行时依然会触发错误。推荐两种靠谱的处理方式：

1. 修改方法返回类型为可空Widget #

将pageUI()的返回类型从Widget改为Widget?，允许返回null，但在使用时要通过空合并运算符处理空值：

class BasePage extends StatefulWidget {
  final int? categoryId;
  const BasePage({this.categoryId, Key? key}) : super(key: key);

  @override
  _BasePageState createState() => _BasePageState();
}

class _BasePageState extends State<BasePage> {
  Widget? pageUI() {
    // 根据分类ID是否存在，返回对应页面或null
    if (widget.categoryId != null) {
      return ProductPage(categoryId: widget.categoryId!);
    }
    return null;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 用空占位Widget兜底null情况
      body: pageUI() ?? const SizedBox.shrink(),
    );
  }
}

2. 返回空占位Widget替代null #

如果不想修改返回类型，直接返回一个不占空间的空Widget，避免返回null：

Widget pageUI() {
  if (widget.categoryId != null) {
    return ProductPage(categoryId: widget.categoryId!);
  }
  // 返回空占位，无视觉效果也不会报错
  return const SizedBox.shrink();
}

二、根据分类ID展示对应ProductPage的实现 #

假设你的ProductPage已支持接收categoryId参数，只需在BasePage中完成参数传递和页面渲染逻辑：

1. 给BasePage添加分类ID参数 #

在BasePage的构造函数中声明必填或可选的分类ID参数：

class BasePage extends StatefulWidget {
  // 若分类ID必传，用required修饰
  final int categoryId;
  const BasePage({required this.categoryId, Key? key}) : super(key: key);

  @override
  _BasePageState createState() => _BasePageState();
}

2. 在pageUI()中返回目标页面 #

直接根据传入的分类ID返回ProductPage，无需返回空值：

Widget pageUI() {
  return ProductPage(categoryId: widget.categoryId);
}

如果存在分类ID无效的场景（比如未选择分类），可以返回提示页面替代空值：

Widget pageUI() {
  if (widget.categoryId > 0) { // 假设ID>0为有效分类
    return ProductPage(categoryId: widget.categoryId);
  }
  return const Center(child: Text("请选择有效分类"));
}

内容的提问来源于stack exchange，提问作者Nulledf