Flutter路由传参报错：The method '[]'无法无条件调用（接收者可为null）

错误原因分析 #

1. 变量遮蔽：你在build方法内声明的final data覆盖了类成员的Map data = {}，且路由参数arguments的类型是Object?，直接当作Map使用会触发类型与空安全错误。
2. 空安全问题：即便用!强制解空ModalRoute.of(context)，settings.arguments本身仍可能为null，直接调用[]不符合Dart空安全规则。
3. 拼写错误：代码中data['loaction']是拼写错误，正确应为data['location']，否则无法正确获取参数。

具体修复步骤 #

1. 修复变量遮蔽与类型转换

避免覆盖类成员变量，同时对路由参数做安全的类型转换与空值处理：

// 替换原build方法内的final data声明
final routeData = ModalRoute.of(context)?.settings.arguments as Map?;
if (routeData != null) {
  setState(() {
    data = routeData;
  });
}

• 使用?.安全访问ModalRoute，避免强制解空导致崩溃
• 用as Map?将arguments转换为可空Map类型
• 仅当参数不为空时，通过setState更新类成员的data，确保页面响应参数变化

2. 安全获取参数值

取值时处理空值情况，避免直接调用[]：

Text(data['location'] ?? '未选择地区')

• 用??运算符为空值提供默认文本，符合空安全规范

3. 修正拼写错误

将loaction改为location，确保参数键名匹配

完整修正代码 #

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
  const Home({super.key});

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  Map data = {};

  @override
  Widget build(BuildContext context) {
    // 安全处理路由参数
    final routeData = ModalRoute.of(context)?.settings.arguments as Map?;
    if (routeData != null) {
      setState(() {
        data = routeData;
      });
    }

    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            TextButton.icon(
              onPressed: () {
                Navigator.pushNamed(context, '/location');
              },
              icon: const Icon(Icons.edit_location),
              label: const Text('Edit Location'),
            ),
            const SizedBox(height: 20.0),
            Row(
              children: [
                Text(
                  data['location'] ?? '未选择地区'
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

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