Simple Flutter Getx code throwing error the improper use of a GetX has been detected

Question

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

class FilePicker extends GetView {
  final FormControl? control;

  const FilePicker({
    this.control,
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Obx(
      () => GestureDetector(onTap: () {}, child: const TextField()),
    );
  }
}

Error

trying to pick a file from gallery. Using Getx for a simple code throwing error.

════════ Exception caught by widgets library ═══════════════════════════════════ The following message was thrown building Obx(has builder, dirty, state: _ObxState#d9976): [Get] the improper use of a GetX has been detected. You should only use GetX or Obx for the specific widget that will be updated. If you are seeing this error, you probably did not insert any observable variables into GetX/Obx or insert them outside the scope that GetX considers suitable for an update (example: GetX => HeavyWidget => variableObservable). If you need to update a parent widget and a child widget, wrap each one in an Obx/GetX.

The relevant error-causing widget was

Answer 1

The Obx needs an usage of observable item like

Obx(() => Text("${controller.name}"));

An observable example .obs

var name = 'Jonatas Borges'.obs;

If you use Obx without it, then becomes improper.