flutter:getx不同页面之间共享变量状态

一，代码:

1,共享变量的controller

import 'package:get/get.dart';

// 定义控制器
class StateController extends GetxController {

  //静态obs
  var goodsNum = 0.obs;

  // 定义一个方法来更新变量
  void increment() {
    goodsNum++;
  }
}

2,页面一：

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

import 'StateController.dart';

class HomePage extends StatefulWidget {
  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage>  {

  StateController stateController = Get.put(StateController());

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text("home页面"),
      ),

      body: Center(
        child:Column(
          children:[
            Obx(() => Text('购物车商品数: ${stateController.goodsNum.value}')),
            ElevatedButton(
              child: Text("跳转到next页面"),
              onPressed: () {
                Get.toNamed("/counter",arguments: {
                  "id":20,
                  "name":"苏东坡新传",
                });
              },
            ),
          ],
        ),

      ),

    );
  }

}

3,页面二:

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getxdemo1/pages/StateController.dart';
import 'CounterController.dart';

class CounterView extends StatefulWidget {
  @override
  State<CounterView> createState() => _CounterViewState();
}

class _CounterViewState extends State<CounterView>  {

  CounterController controller = Get.put(CounterController());
  final stateController = Get.find<StateController>();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GetView Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() => Text('购物车商品数: ${stateController.goodsNum.value}')),
            Obx(() => Text('id: ${controller.id.value}')),
            Obx(() => Text('name: ${controller.name.value}')),
            Obx(() => Text('Count: ${controller.count.value}')),
            ElevatedButton(
              onPressed: stateController.increment,
              child: Text('Increment'),
            ),
          ],
        ),
      ),
    );
  }
}

说明：

在 GetX 中，状态管理主要依赖以下几个核心概念：

obs：obs 是一个可观察的变量，任何对它的更改都会自动通知监听它的 UI 更新。
GetxController：控制器类，用于管理状态和业务逻辑。
Obx：一个响应式小部件，用于监听 obs 变量的变化并更新 UI。
Get.put()：用于将控制器实例注入到依赖管理中，方便在不同页面共享状态。
Get.find()：用于在需要的地方获取已经注入的控制器实例。

如果一个controller没有做put,直接做find时会报错

二，测试效果:

页面二:

在页面二点击后的页面一