如何使用从页面到自身的 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

在这个 DetailsView 页面中，我希望当单击哪个 countries.border 时，它会推送到 countries.name == countries.border.[=21 的新 Detailsview 页面=]

我用 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();

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

How to use GetX Navigation from a Page to itself

flutter

flutter-getx