flutter使用Obs和Rx

例子1

class CounterPage extends StatelessWidget {

  var count = 0.obs;
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Counter")),
      body: Center(
        child: Obx(() {
          return Text("${count.value}", style: const TextStyle(fontSize: 50),);
        }),
      ),
      floatingActionButton: FloatingActionButton(
        child: const Icon(Icons.add),
        onPressed: (){
          count += 1;
        },
      ),
    );
  }
}

例子2

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'counter_controller.dart'; // 导入 CounterController

//用getX作为数据的管理
void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      home: CounterPage(num: 0),
    );
  }
}

class CounterPage extends StatelessWidget {
  final int num ;
  final CounterController controller =
      Get.put(CounterController()); // 实例化 CounterController 并绑定到页面  不同的页面好像共用一个

   CounterPage({super.key, required this.num});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GetX Counter Example $num'),
        actions: [
          IconButton(
              onPressed: () {
                // Get.to(CounterPage());
                Navigator.of(context)
                    .push(MaterialPageRoute(builder: (BuildContext context) {
                  return CounterPage(num: num+1,);
                }));
              },
              icon: const Icon(Icons.add_reaction_rounded)),
        ],
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() => Text('Count: ${controller.count}',
                style: TextStyle(fontSize: 24.0))),
            SizedBox(height: 20.0),
            ElevatedButton(
              onPressed: () => controller.increment(), // 调用增加方法
              child: Text('Increment'),
            ),
            ElevatedButton(
              onPressed: () => controller.decrement(), // 调用减少方法
              child: Text('Decrement'),
            )
          ],
        ),
      ),
    );
  }
}

import 'package:get/get.dart';

class CounterController extends GetxController {
  var count = 0.obs ; // 声明一个可观察的变量来存储计数器的值

  // 定义一个增加计数器值的方法
  void increment() {
    count++;
  }

  // 定义一个减少计数器值的方法
  void decrement() {
    count--;
  }
}