已检测到 Getx 的不当使用

Question

我使用 Getx，更具体地说是 Obx 小部件。 这是我使用 Obx 的代码片段：

class CustumTextFormField extends StatelessWidget {
  const CustumTextFormField({
    super.key,
    required this.textFieldLable,
    required this.isPassword,
    required this.custumController,
  });

  final String textFieldLable;
  final bool isPassword;
  final CustumTextFormFieldController custumController;

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        FormLable(
          text: textFieldLable,
        ),
        SizedBox(
          height: fullHeight(context) * .01,
        ),
        Container(
            padding: EdgeInsets.symmetric(
                vertical: 2, horizontal: fullWidth(context) * .02),
            height: fullHeight(context) * 0.07,
            decoration: BoxDecoration(
                border: Border.all(
                  width: 1,
                  color: Color(0xFFD6D6D6),
                ),
                borderRadius: BorderRadius.circular(8)),
            child: Obx(
              () => TextFormField(
                obscureText: isPassword && custumController.showPasword.value,
                decoration: InputDecoration(
                    border: InputBorder.none,
                    suffixIcon: isPassword
                        ? GestureDetector(
                            onTap: () {
                              custumController.togleShowPassword();
                            },
                            child: Icon( // Removed Obx here
                              custumController.showPasword.value
                                  ? Icons.visibility_off
                                  : Icons.visibility,
                              color: Color(0xFF101010),
                            ),
                          )
                        : null),
              ),
            )),
      ],
    );
  }
}

我在 Obx 中使用了两次可观察变量，但仍然收到错误，表明我使用 Obx 不当。

错误信息：════════小部件库捕获异常═══════════════════════════ ══════ ══ [Get] 已检测到 GetX 的不当使用。 您应该仅对将更新的特定小部件使用 GetX 或 Obx。 如果您看到此错误，您可能没有将任何可观察变量插入 GetX/Obx 或者将它们插入 GetX 认为适合更新的范围之外 （例如：GetX=>HeavyWidget=>variableObservable）。 如果您需要更新父小部件和子小部件，请将每个小部件包装在 Obx/GetX 中。 相关的导致错误的小部件是：

class CustumTextFormField extends StatelessWidget {
  const CustumTextFormField({
    super.key,
    required this.textFieldLable,
    required this.isPassword,
    required this.custumController,
  });

  final String textFieldLable;
  final bool isPassword;
  final CustumTextFormFieldController custumController;

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        FormLable(
          text: textFieldLable,
        ),
        SizedBox(
          height: fullHeight(context) * .01,
        ),
        Container(
            padding: EdgeInsets.symmetric(
                vertical: 2, horizontal: fullWidth(context) * .02),
            height: fullHeight(context) * 0.07,
            decoration: BoxDecoration(
                border: Border.all(
                  width: 1,
                  color: Color(0xFFD6D6D6),
                ),
                borderRadius: BorderRadius.circular(8)),
            child: Obx(
              () => TextFormField(
                obscureText: isPassword && custumController.showPasword.value,
                decoration: InputDecoration(
                    border: InputBorder.none,
                    suffixIcon: isPassword
                        ? GestureDetector(
                            onTap: () {
                              custumController.togleShowPassword();
                            },
                            child: Icon( // Removed Obx here
                              custumController.showPasword.value
                                  ? Icons.visibility_off
                                  : Icons.visibility,
                              color: Color(0xFF101010),
                            ),
                          )
                        : null),
              ),
            )),
      ],
    );
  }
}

Answer 1

试试这个：

class CustumTextFormField extends StatelessWidget {
  CustumTextFormField({
    super.key,
    required this.textFieldLable,
    required this.isPassword,
    required this.custumController,
  });

  var textFieldLable = "".obs;
  var isPassword = false.obs;
  CustumTextFormFieldController custumController;

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        FormLable(
          text: textFieldLable,
        ),
        SizedBox(
          height: fullHeight(context) * .01,
        ),
        Container(
            padding: EdgeInsets.symmetric(
                vertical: 2, horizontal: fullWidth(context) * .02),
            height: fullHeight(context) * 0.07,
            decoration: BoxDecoration(
                border: Border.all(
                  width: 1,
                  color: Color(0xFFD6D6D6),
                ),
                borderRadius: BorderRadius.circular(8)),
            child: Obx(
                  () => TextFormField(
                obscureText: isPassword && custumController.showPasword.value,
                decoration: InputDecoration(
                    border: InputBorder.none,
                    suffixIcon: isPassword
                        ? GestureDetector(
                      onTap: () {
                        custumController.togleShowPassword();
                      },
                      child: Icon( // Removed Obx here
                        custumController.showPasword.value
                            ? Icons.visibility_off
                            : Icons.visibility,
                        color: Color(0xFF101010),
                      ),
                    )
                        : null),
              ),
            )),
      ],
    );
  }
}