Flutter GetX Tag 特点运用详解

了解 Flutter GetX Tag 特点的界说、用处、完成方式和常见问题。

Flutter GetX Tag 属性使用详解

前语

Flutter中，GetX是一款十分盛行的状况管理库。它不仅供给了状况管理的功用，还有路由、依赖注入和许多其他功用。在这篇文章中，我将介绍如安在Flutter中正确运用GetX的标签（Tag）功用。

很多同学在问我 Getx 问题的时分，我发现都对 tag 特点不清楚，今日咱们就来讲一讲。

视频

www.bilibili.com/video/BV1eP…

知识点

在 Flutter GetX 中，tag 特点是用于标识控制器（Controller）实例的字符串，具体作用如下：

区分不同的控制器实例

在一个 Flutter GetX 应用程序中，可能会存在多个相同类型的控制器实例，例如多个页面运用相同的数据控制器。运用 tag 特点可认为不同的控制器实例分配不同的标识，以便在不同的页面中运用不同的控制器实例。

保存控制器状况

运用 tag 特点可认为控制器实例分配唯一的标识，以便在应用程序生命周期中保存控制器的状况。例如，在页面切换时，能够通过 tag 特点保存当时页面的控制器状况，以便在页面重新打开时恢复控制器状况。

防止控制器重复创立

运用 tag 特点能够防止相同类型的控制器实例重复创立。例如，在多个页面中运用相同的数据控制器时，运用相同的 tag 标识能够保证只创立一个控制器实例，以削减资源的消耗。

正文

Flutter GetX Tag 属性使用详解

假如不设置 tag 将运用相同的控制器

控制器

lib/pages/post_detail/controller.dart

import 'package:get/get.dart';
import 'index.dart';
class PostDetailController extends GetxController {
  PostDetailController();
  int num = 0;
  _initData() {
    update(["post_detail"]);
  }
  void onTap() {
    num++;
    update(["post_detail"]);
  }
  void onNextPage() {
    // 当时时刻戳
    final int timestamp = DateTime.now().millisecondsSinceEpoch;
    Get.to(PostDetailPage(),
        routeName: "/post/$timestamp", arguments: {"timestamp": "$timestamp"});
  }
  @override
  void onReady() {
    super.onReady();
    _initData();
  }
}

视图

lib/pages/post_detail/view.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'index.dart';
class PostDetailPage extends GetView<PostDetailController> {
  PostDetailPage({Key? key}) : super(key: key);
  final String timestamp = Get.arguments?["timestamp"] ??
      DateTime.now().millisecondsSinceEpoch.toString();
  // 主视图
  Widget _buildView() {
    return Center(
      child: Column(
        children: [
          Text("计数 num : ${controller.num}"),
          ElevatedButton(
            onPressed: controller.onTap,
            child: const Text("加法计算"),
          ),
          ElevatedButton(
            onPressed: controller.onNextPage,
            child: const Text("再开一个界面"),
          ),
        ],
      ),
    );
  }
  @override
  Widget build(BuildContext context) {
    return GetBuilder<PostDetailController>(
      init: PostDetailController(),
      id: "post_detail",
      builder: (_) {
        return Scaffold(
          appBar: AppBar(title: Text("post_detail $timestamp")),
          body: SafeArea(
            child: _buildView(),
          ),
        );
      },
    );
  }
}

参加 tag 特点就能区分不同控制器

控制器

lib/pages/post_detail/controller.dart

import 'package:get/get.dart';
import 'index.dart';
class PostDetailController extends GetxController {
  PostDetailController();
  int num = 0;
  _initData() {
    update(["post_detail"]);
  }
  void onTap() {
    num++;
    update(["post_detail"]);
  }
  void onNextPage() {
    // 当时时刻戳
    final int timestamp = DateTime.now().millisecondsSinceEpoch;
    Get.to(PostDetailPage(),
        routeName: "/post/$timestamp", arguments: {"timestamp": "$timestamp"});
  }
  @override
  void onReady() {
    super.onReady();
    _initData();
  }
}

视图

lib/pages/post_detail/view.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'index.dart';
class PostDetailPage extends GetView<PostDetailController> {
  PostDetailPage({Key? key}) : super(key: key);
  final String timestamp = Get.arguments?["timestamp"] ??
      DateTime.now().millisecondsSinceEpoch.toString();
  @override
  String? get tag => timestamp;
  // 主视图
  Widget _buildView() {
    return Center(
      child: Column(
        children: [
          Text("计数 num : ${controller.num}"),
          ElevatedButton(
            onPressed: controller.onTap,
            child: const Text("加法计算"),
          ),
          ElevatedButton(
            onPressed: controller.onNextPage,
            child: const Text("再开一个界面"),
          ),
        ],
      ),
    );
  }
  @override
  Widget build(BuildContext context) {
    return GetBuilder<PostDetailController>(
      init: PostDetailController(),
      tag: timestamp,
      id: "post_detail",
      builder: (_) {
        return Scaffold(
          appBar: AppBar(title: Text("post_detail $timestamp")),
          body: SafeArea(
            child: _buildView(),
          ),
        );
      },
    );
  }
}

代码

github.com/ducafecat/f…

小结

在Flutter中运用GetX的标签（Tag）功用能够区分不同的控制器实例、保存控制器状况和防止控制器重复创立。在本文中，猫哥介绍了如何正确运用GetX的标签功用，以及如安在Flutter GetX中运用tag特点来标识控制器实例。

猫哥 ducafecat.com

end

本文由mdnice多渠道发布