简体   繁体   English

Flutter:一个FocusNode被丢弃后被使用

[英]Flutter: A FocusNode was used after being disposed

I have a simple Flutter form inside a stateful widget with a bunch of text fields to capture credit card details.我在一个有状态的小部件中有一个简单的 Flutter 表单,其中有一堆文本字段来捕获信用卡详细信息。 And when I show this form, tap the first field, type something in it, then tap the second field, the focus is not transferred to the second field, the cursor stays in the first one, even though both fields appear focused (border is visible on both) and when I type, it goes in the first field.当我显示此表单时,点击第一个字段,在其中输入一些内容,然后点击第二个字段,焦点不会转移到第二个字段,光标停留在第一个字段,即使两个字段都显示为焦点(边框是两者都可见),当我输入时,它进入第一个字段。 The only way to type something into the second field is to long tap it as if I wanted to paste something in it.在第二个字段中输入内容的唯一方法是长按它,就像我想在其中粘贴一些东西一样。 And in the console, I see this:在控制台中,我看到了这个:

[VERBOSE-2:ui_dart_state.cc(199)] Unhandled Exception: A FocusNode was used after being disposed.
Once you have called dispose() on a FocusNode, it can no longer be used.
#0      ChangeNotifier._debugAssertNotDisposed.<anonymous closure> (package:flutter/src/foundation/change_notifier.dart:117:9)
#1      ChangeNotifier._debugAssertNotDisposed (package:flutter/src/foundation/change_notifier.dart:123:6)
#2      ChangeNotifier.notifyListeners (package:flutter/src/foundation/change_notifier.dart:234:12)
#3      FocusNode._notify (package:flutter/src/widgets/focus_manager.dart:1052:5)
#4      FocusManager._applyFocusChange (package:flutter/src/widgets/focus_manager.dart:1800:12)
#5      _rootRun (dart:async/zone.dart:1346:47)
#6      _CustomZone.run (dart:async/zone.dart:1258:19)
#7      _CustomZone.runGuarded (dart:async/zone.dart:1162:7)

The thing is that none of the fields have a focus node set, so it seems something wrong is happening inside the Flutter form state.问题是所有字段都没有设置焦点节点,因此 Flutter 表单状态中似乎发生了一些错误。 Has anybody seen this?有人见过这个吗?

Note that for me, it occurs on the web and on mobile alike, but not consistently.请注意,对我来说,它发生在网络和移动设备上,但并非始终如一。

Here is the code of the problematic form .这是有问题的表单的代码。

And here is a screenshot illustrating 2 fields having focus at the same time, and the cursor being stuck in the first one.这是一个屏幕截图,说明 2 个字段同时具有焦点,并且光标停留在第一个字段中。 And when I type something on the keyboard, it's directed at the first field.当我在键盘上输入内容时,它会指向第一个字段。 This is running on an physical iPhone device.这是在物理 iPhone 设备上运行的。

在此处输入图片说明

And here is the function that is called as the onPressed of an ElevatedButton to show this form:这是作为ElevatedButtononPressed调用的函数以显示此表单:

Future<void> _addPaymentMethod(BuildContext context) async {
    await Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => Scaffold(
          body: CardForm(),
        ),
      ),
    );
  }

I think the problem is using Focus widget.我认为问题在于使用 Focus 小部件。

You should be using FocusNode and pass this FocusNode as one of the named arguments of TextField (your CardCvcFormField).您应该使用 FocusNode 并将此 FocusNode 作为 TextField(您的 CardCvcFormField)的命名参数之一传递。

You can attach a listener to the FocusNode and get the focus visibility.您可以将侦听器附加到 FocusNode 并获得焦点可见性。

FocusNode _cvcFocusNode;

@override
void initState() {
    super.initState();
    _cvcFocusNode = FocusNode();
    _cvcFocusNode.addListener(_onCvcFormFieldFocusChanged);
}

void _onCvcFormFieldFocusChanged() {
   setState(() => cvcHasFocus = _cvcFocusNode?.hasFocus ?? false);
}

@override
void dispose() {
   _cvcFocusNode?.removeListener(_onCvcFormFieldFocusChanged);
   _cvcFocusNode?.dispose();
   _cvcFocusNode = null;
   super.dispose();
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM