Flutter报错：NoSuchMethodError，调用null对象的screenRoute属性

错误提示：The getter 'screenRoute' was called on null flutter tried calling:screenRoute

我正在跟着课程实现旅行页面的一键删除功能，已经修改了多个页面，其中改动最大的是TripItem组件，代码如下：

import 'package:flutter/material.dart';
import 'package:traveling_trip/models/trip.dart';
import 'package:traveling_trip/screens/trip_detalls_screen.dart';

class TripItem extends StatelessWidget {
  final String id;
  final String title;
  final String imageUrl;
  final int duration;
  final Season season;
  final TripType tripType;
  final Function removeItem;

  const TripItem({
    Key? key,
    required this.title,
    required this.imageUrl,
    required this.duration,
    required this.season,
    required this.tripType,
    required this.id,
    required this.removeItem,
  }) : super(key: key);

  String get seasontext {
    switch (season) {
      case Season.Winter:
        return "winter";
      case Season.Summer:
        return "summer";
      case Season.Spring:
        return "spring";
      case Season.Autumn:
        return "autumn";
    }
  }

  String get tripTypetext {
    switch (tripType) {
      case TripType.Recovery:
        return "Recovery";
      case TripType.Therapy:
        return "Therapy";
      case TripType.Activities:
        return "Activities";
      case TripType.Exploration:
        return "Exploration";
    }
  }

  void selectTrip(BuildContext context) {
    Navigator.of(context)
        .pushNamed(TripDetallsScreen.screenRoute, arguments: id)
        .then((result) {
      print(result);
    });
  }

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () => selectTrip(context),
      child: Card(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(15),
        ),
        elevation: 7,
        margin: EdgeInsets.all(10),
        child: Column(
          children: [
            Stack(
              children: [
                ClipRRect(
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(15),
                    topRight: Radius.circular(15),
                  ),
                  child: Image.network(
                    imageUrl,
                    height: 250,
                    width: double.infinity,
                    fit: BoxFit.cover,
                  ),
                ),
                Container(
                  height: 250,
                  alignment: Alignment.bottomRight,
                  decoration: BoxDecoration(
                    gradient: LinearGradient(
                      begin: Alignment.topCenter,
                      end: Alignment.bottomCenter,
                      colors: [
                        Colors.black.withAlpha(0),
                        Colors.black.withOpacity(0.80),
                      ],
                      stops: [0.6, 1],
                    ),
                  ),
                  child: Text(
                    title,
                    style: Theme.of(context).textTheme.headlineMedium?.copyWith(
                          color: Colors.white,
                        ),
                    overflow: TextOverflow.fade,
                  ),
                ),
              ],
            ),
            Container(
              padding: EdgeInsets.all(15),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  Row(
                    children: [
                      Icon(
                        Icons.today,
                        size: 30,
                        color: Colors.amber,
                      ),
                      SizedBox(width: 7),
                      Text(
                        "$duration أيام",
                        style: TextStyle(fontSize: 20),
                      ),
                    ],
                  ),
                  Row(
                    children: [
                      Icon(
                        Icons.wb_sunny,
                        size: 30,
                        color: Colors.amber,
                      ),
                      SizedBox(width: 7),
                      Text(
                        "$seasontext",
                        style: TextStyle(fontSize: 20),
                      ),
                    ],
                  ),
                  Row(
                    children: [
                      Icon(Icons.family_restroom,
                          color: Colors.amber, size: 30),
                      SizedBox(width: 7),
                      Text(
                        "$tripTypetext",
                        style: TextStyle(fontSize: 20),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

错误原因及解决方法 #

这个错误的核心是：你尝试访问TripDetallsScreen.screenRoute时，这个属性所属的类实例或属性本身为null。常见原因和对应解决方式如下：

1. 未正确定义静态属性screenRoute
   打开trip_detalls_screen.dart文件，确认TripDetallsScreen类中存在静态常量screenRoute，示例代码：

   class TripDetallsScreen extends StatelessWidget {
     static const String screenRoute = '/trip-details'; // 必须是静态常量
     // 其他页面代码...
   }
   

2. 拼写错误
   检查类名和属性名的拼写：比如你代码中的TripDetallsScreen可能是笔误（正确应为TripDetailsScreen），需要统一修改所有引用处的拼写，确保和目标类名完全一致。

3. 导入路径错误
   核对导入语句import 'package:traveling_trip/screens/trip_detalls_screen.dart';的路径，确认文件确实存在于对应目录下，路径拼写无错误。

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