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

【问题标题】：How to use GetX Navigation from a Page to itself如何使用从页面到自身的 GetX 导航
【发布时间】：2021-08-21 19:21:33
【问题描述】：

我有一个这样的列表：

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

在 HomeView 页面上会出现 countries.name 的列表，点击后 => 转到显示 countries.border 的 DetailsView 页面

在这个DetailsView页面中，我希望当点击哪个countries.border时，它会推送到countries.name == countries.border的新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),
                        ),
                      )
                    ],
                  );
                },
              ),
            ),
        ],
      ),
    );
  }
}

【问题讨论】：

标签： flutter flutter-getx

【解决方案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();

【讨论】：