Flutter提示The getter 'params' isn't defined for the type 'GoRouterState'，请教可以怎么修改？

Question

Flutter编写“按下按钮改变位置坐标”的简单代码时，一直提示The getter 'params' isn't defined for the type 'GoRouterState'，麻烦请教可以怎么修改？

代码如下：

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final GoRouter router = GoRouter(
    routes: <GoRoute>[
      GoRoute(
        path: '/',
        builder: (context, state) => const MazePage(x: 0, y: 0),
      ),
      GoRoute(
        path: '/x/:x/y/:y',
        builder: (context, state) {
          final Map<String, String> params = state.params; 
          final String xParam = params['x'] ?? '0';
          final String yParam = params['y'] ?? '0';
          final int x = int.tryParse(xParam) ?? 0;
          final int y = int.tryParse(yParam) ?? 0;
          return MazePage(x: x, y: y);
        },
      ),
    ],
    redirect: (context, state) => '/',
  );

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerDelegate: router.routerDelegate,
      routeInformationParser: router.routeInformationParser,
      title: 'Maze Navigation',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
    );
  }
}

class MazePage extends StatelessWidget {
  final int x;
  final int y;

  const MazePage({required this.x, required this.y});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Maze Navigation'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('You are at ($x, $y)'),
          ],
        ),
      ),
    );
  }
}

Answer 1

以下内容由AIGC及阿里嘎多学长共同生成、有用望采纳：

---

从你提供的代码来看，你已经正确地使用了GoRouter来配置路由和捕获URL参数。问题提示“The getter 'params' isn't defined for the type 'GoRouterState'”通常意味着你尝试访问GoRouterState类型的params属性，但这个类型并没有定义这个属性。

然而，在GoRouter中，params属性实际上是在GoRouterState的location属性中。所以，你应该从state.location获取params。

你的代码中，params的获取方式应该是这样的：

final Map<String, String> params = state.location.params;

而不是：

final Map<String, String> params = state.params; // 这是错误的

因此，你应该修改你的路由配置中的builder函数，将params的获取方式更正。以下是修正后的代码段：

GoRoute(
  path: '/x/:x/y/:y',
  builder: (context, state) {
    final Map<String, String> params = state.location.params; // 修改这里
    final String xParam = params['x'] ?? '0';
    final String yParam = params['y'] ?? '0';
    final int x = int.tryParse(xParam) ?? 0;
    final int y = int.tryParse(yParam) ?? 0;
    return MazePage(x: x, y: y);
  },
),

请注意，state参数是从GoRouter传递到builder函数的，它包含了当前路由的状态，包括location，它又包含了路由的参数params。

此外，你的MazePage类和构造函数看起来是正确的，不需要进行修改。确保UI能够正确显示参数的部分，你已经做得很好了。

最后，确保你已经正确地导入了go_router包，并且版本是最新的，因为API可能会随着版本的更新而有所变化。如果问题仍然存在，检查是否有其他代码或配置错误，或者查看GoRouter的官方文档和GitHub仓库的issue跟踪，看看是否有其他人遇到了类似的问题。