🐡
Flutter GoRouterでのtype 'Null' is not a subtype of type ~ エラー
GoRouterでの値受け渡しエラー
Flutterのルーティングに下記を利用しています。
画面が黒画面になったり、色々経験させてもらっています。
さて、GoRouterを利用していて親画面から子画面に遷移しようとした際に、
type 'Null' is not a subtype of type '%%%%' in type cast
上記とエラーと遭遇。
初めてのエラーだったので、なんだなんだと考えていたら、親から子に値を渡してないのが原因でした。。。。
子にはパラメータ要らないのに、GoRouterで親子関係のためにネストで記載すると必要になるらしいです。。。
しらなかった。。。
下記の記事を参考にしました。
extraとは?
GoRouterでオブジェクトを渡すときに利用するパラメータになります。
intやstringなら他の方法で渡せるのですが、オブジェクトの場合だと下記の様な渡し方になります。
class PersonRouteWithExtra extends GoRouteData {
PersonRouteWithExtra(this.$extra);
final Person $extra;
Widget build(BuildContext context) => PersonScreen(person: $extra);
}
実際に書くと下記の様になるかと思います。(デモ記載)
import 'package:go_router/go_router.dart';
import 'package:flutter/material.dart';
// 親ルートと子ルートの定義
final GoRouter router = GoRouter(
routes: [
TypedGoRoute<ParentRoute>(
path: 'Parent',
routes: [
TypedGoRoute<ChildRoute>(
path: 'Child',
),
],
),
],
);
/// 省略
class ParentRoute extends GoRouteData {
/// Constructor
const ParentRoute(this.$extra);
/// 業態
final Person $extra;
Widget build(BuildContext context, GoRouterState state) => ParentPage(
person: $extra,
);
}
class ChildRoute extends GoRouteData {
/// Constructor
const ChildRoute([this.$extra]);
/// null許容にする
final Person? $extra;
Widget build(BuildContext context, GoRouterState state) =>
const ChildPage();
}
実際の使い方
下記の様になります。
親は必要なのでpersonを渡しますが、子は必要ありません。
しかしGoRouterだと親→子は同じということで一応わたします。
ただ、子の方はnull許容をいれて子画面では利用しないようにすればエラーは回避できます。
/// 親
const ParentRoute(person).push(context);
/// 子 必要ないけど値を渡す
const ChildRoute(person).push(context);
他のやり方をさがしたのですが、GoRouterでオブジェクトを渡すのはこれしかないようで、
あとは状態管理系のrevepodなどで値を保持して画面間で利用するしかないのかなと思います。
調べ切れてないですが、上記でエラーは無くなりました。
Discussion