GetX not showing the updated value

Question

I am trying a simple pop-up that should increment everytime I press the 'Use' button. Using the print command, it is showing the correct current value everytime I press. But for the Text itself, it is just staying a constant value. Any suggestion to fix this? Thanks!

  showUsePopup() async {
    AwesomeDialog(
      context: globalScaffoldKey.currentContext!,
      dialogType: DialogType.NO_HEADER,
      dismissOnTouchOutside: false,
      headerAnimationLoop: false,
      animType: AnimType.SCALE,
      body: Column(
        children: [
          Row(
            children: [
              Text('${controller.numOfItemObs.value}'),
              ElevatedButton(
                onPressed: () {
                  controller.numOfItemObs.value++;
                  print('Current value: ${controller.numOfItemObs.value}');
                },
                child: const Text('Use'),
              ),
            ],
          ),
        ],
      ),
      showCloseIcon: false,
      btnOkOnPress: () async {},
    ).show();
  }

Answer 1

You need to wrap up the Text widget with Obx. It will update the Text value whenever the changes happen. Here is the example that you can follow.

Obx(
      () => Text('${controller.numOfItemObs.value}')')
   ),