如何使用 GetX 从页面导航到自身

Question

我有一个这样的列表：

  List<Country> countries = [
    Country(name: 'United States', border: ['Mexico', 'Canada']),
    Country(name: 'Mexico', border: ['United States']),
    Country(name: 'Canada'),
  ];

在HomeView页面上将出现一个列表countries.name，单击时 => 转到显示的DetailsView页面countries.border

在此详细信息视图页面中，我希望当单击哪个时countries.border，它将推送到新的详细信息视图页面countries.name == countries.border。

我能够做到这一点Navigator().push

 //Use Navigator().push
                          Navigator.of(context).push(MaterialPageRoute(
                            builder: (_) => DetailView(country: controller.countries[i]),

但不能这样做Get.to：

//Use Get.to not succeed
                          Get.to(() => DetailView(country: controller.countries[i]));

所以请帮助我，这是完整的代码：

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

void main() async {
  runApp(GetMaterialApp(
    debugShowCheckedModeBanner: false,
    home: HomeView(),
  ));
}

class Country {
  String name;
  List<String> border;

  Country({this.name, this.border});
}

class HomeController extends GetxController {
  List<Country> countries = [
    Country(name: 'United States', border: ['Mexico', 'Canada']),
    Country(name: 'Mexico', border: ['United States']),
    Country(name: 'Canada'),
  ];
}

class HomeView extends GetView<HomeController> {
  final controller = Get.put(HomeController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('List Countries')),
      body: ListView.separated(
        separatorBuilder: (_, __) => Divider(),
        itemCount: controller.countries.length,
        itemBuilder: (BuildContext context, int index) {
          return ListTile(
            title: Text(controller.countries[index].name),
            onTap: () => Get.to(
              () => DetailView(
                country: controller.countries[index],
              ),
            ),
          );
        },
      ),
    );
  }
}

class DetailView extends GetView<HomeController> {
  final Country country;

  DetailView({this.country});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(country.name)),
      body: Column(
        children: [
          Text('Border'),
          if (country.border != null)
            Expanded(
              child: ListView.builder(
                itemCount: country.border.length,
                itemBuilder: (BuildContext context, int index) {
                  return Column(
                    children: [
                      GestureDetector(
                        onTap: () {
                          final currentCountry = controller.countries.firstWhere(
                              (e) => e.name == country.border[index],
                              orElse: () => null);
                          int i = controller.countries.indexOf(currentCountry);

                          //Use Get.to not succeed
                          // Get.to(() => DetailView(country: controller.countries[i]));

                          //Use Navigator().push
                          Navigator.of(context).push(MaterialPageRoute(
                            builder: (_) => DetailView(country: controller.countries[i]),
                          ));
                        },
                        child: Text(
                          country.border[index],
                          style:
                              TextStyle(color: Colors.blue, decoration: TextDecoration.underline),
                        ),
                      )
                    ],
                  );
                },
              ),
            ),
        ],
      ),
    );
  }
}

Answer 1

您可以添加 PreventDuplicates 标志：

 Get.to(() => DetailView(country: controller.countries[i]), preventDuplicates: false);

因此，我认为您需要在主文件上使用 Create 来放置控制器，因此每次您调用屏幕时，它都会为此创建另一个控制器：

//main.dart
Get.create(() => Controller());

//so you call this way on the DetailView page
final controller = Get.find();