Flutter登录页面Unexpected null value错误排查求助

问题现象 #

运行登录页面时抛出Unexpected null value错误，关联Widget为Scaffold，尝试GetX空值检查后问题仍存在。

错误栈关键信息 #

══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
The following TypeErrorImpl was thrown building KeyedSubtree-[GlobalKey#f49c4]:
Unexpected null value.

The relevant error-causing widget was:
Scaffold Scaffold:file:///C:/Users/Nero/Desktop/snaptow/lib/screens/login/login_screen.dart:26:12

关键调用栈：
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 296:3       throw_
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 606:18  nullCheck
packages/get/get_state_manager/src/simple/get_state.dart 134:40                   initState

代码问题定位 #

1. 错误使用GetBuilder：代码中使用GetBuilder<GetxController>，但GetxController是GetX的抽象基类，并未创建对应的实例并注入到GetX依赖管理中，导致GetBuilder无法找到Controller实例，触发空值异常。
2. 强制解空风险：onSubmit方法中直接使用input!强制解空，若输入为空会触发空值错误。
3. 冗余空值检查：Get.width和Get.height本身由GetX保证不会为null，无需添加??0的空值兜底。

修复方案 #

方案1：移除不必要的GetBuilder（推荐） #

当前页面未使用自定义GetX Controller，直接移除GetBuilder包裹即可解决核心空值问题。

方案2：使用自定义Controller（若后续需要状态管理） #

创建自定义Controller并在页面初始化时注入：

class LoginController extends GetxController {}

// 在页面initState中注入
@override
void initState() {
  super.initState();
  Get.put(LoginController());
}

// 然后使用GetBuilder<LoginController>

其他细节修复 #

• 处理onSubmit中的空输入，避免强制解空
• 移除Get.width/Get.height的冗余空值检查

完整修复代码 #

import 'package:uber_version_2/screens/login/widgets/country_mobile_widget.dart';
import 'package:uber_version_2/screens/login/widgets/intro_widget.dart';
import 'package:uber_version_2/screens/otp/otp_screen.dart';
import 'package:uber_version_2/utils/app_colors.dart';
import 'package:fl_country_code_picker/fl_country_code_picker.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:google_fonts/google_fonts.dart';

class LoginScreen extends StatefulWidget {
  static String routeName = "/LoginScreen";
  const LoginScreen({Key? key}) : super(key: key);

  @override
  State<LoginScreen> createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final countryPicker = const FlCountryCodePicker();

  CountryCode countryCode =
      const CountryCode(name: 'SouthAfrica', code: "ZAR", dialCode: "+27");

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.greenColor,
      body: SizedBox(
        width: Get.width,
        height: Get.height,
        child: SingleChildScrollView(
          child: Column(
            children: [
              const IntroWidget(),
              Container(
                width: Get.width,
                height: Get.height - Get.height * 0.6,
                decoration: const BoxDecoration(
                    color: Color(0xFFFFFFFF),
                    borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(25),
                        topRight: Radius.circular(25))),
                child: Column(
                  children: [
                    const SizedBox(height: 15),
                    const Text("Sign in now"),
                    CountryMobileWidget(countryCode, () async {
                      final code = await countryPicker.showPicker(
                          context: context);
                      if (code != null) {
                        setState(() {
                          countryCode = code;
                        });
                      }
                    }, onSubmit),
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  onSubmit(String? input) {
    if (input == null || input.trim().isEmpty) {
      // 处理空输入，比如提示用户
      Get.snackbar("错误", "请输入手机号");
      return;
    }
    Navigator.pushNamed(context, OTPScreen.routeName,
        arguments: "${countryCode.dialCode}$input");
  }
}

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