flutter - 在 buildMethod 中分配 TextEditingController 的值

Question

我有一些关于创建 TexEditingController 的正确方法的问题；

假设我想创建一个带有固定文本的 Controller ，那么我可以这样做:

TextEditingController bioEditorController = new TextEditingController(text:"dummy");

现在我的问题是:

如果我使用一个有状态的小部件，我可以创建这个 Controller 并通过这样做分配一个初始文本:

TextEditingController bioEditorController;

@override
void initState() {
  bioEditorController = new TextEditingController(text: "dummy");
  super.initState();
}

但如果我不使用有状态的小部件，那么做这样的事情是否正确:

@override
Widget build(BuildContext context) {
 TextEditingController bioEditorController =
    new TextEditingController(text: controller.profile.value.bio);

我的意思是在 build 方法中创建这个 Controller 是否正确，如果我喜欢这样它就可以工作，但我认为这可能不是做这件事的最佳方式，也因为我知道 Controller 也应该被处置....

我真的需要一些帮助来澄清这一点。谢谢

Answer 1

您假设在构建方法中这样做并不理想，这是正确的。与 initState 相比，您对构建方法运行次数的控制要少得多。

虽然在处理 TextEditingControllers(或 hooks )时通常需要一个有状态的小部件，但如果您使用 GetX状态管理绝对没问题，最好不要仅仅因为需要 TextEditingController 就使用有状态的小部件。

这种方式的另一个好处是可以很容易地从应用程序的任何其他位置访问 TextEditingController 的值。

这是一个简单的例子。这是一个您可以保留所有 TextEditingControllers 的类。

class TextController extends GetxController {
  RxString textfieldString = ''.obs; // observable String

  TextEditingController textController;

// this onInit replaces initState of a stateful widget
  @override
  onInit() {
    super.onInit();
    textController = TextEditingController(text: 'dummy');

// adding a listener that automatically updates the textfieldString with the textfield value

    textController.addListener(() {
      textfieldString.value = textController.text;
      debugPrint(textfieldString.value);
    });
  }
}

在您实际使用之前或任何时候在您的主 Controller 中初始化 Controller 。这是调用该类的 onInit 的时候。

Get.put(TextController()).textController;

这里是 Page1 一个无状态小部件，其中包含一个已初始化的 TextEditingController

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final controller = Get.find<TextController>(); // finding same initialized controller
    return Scaffold(
      body: Center(
        child: TextFormField(
          controller: controller.textController, // using TextEditingConroller from GetX class
        ),
      ),
    );
  }
}

下面是一个不同页面上的文本小部件的快速示例，它会在用户输入 TextFormField

时自动更新

class Page2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final controller =
        Get.find<TextController>(); // finding same instance of controller
    return Scaffold(
      body: Center(
        // this Obx widget rebuilds based on any updates
        child: Obx(
          () => Text(controller.textfieldString.value),
        ),
      ),
    );
  }
}

因此，无论您在应用中的哪个位置，都可以访问该 TextFormField 的值，而不必使用有状态小部件。 GetxController 将在不使用时从内存中删除。

此时我唯一需要使用有状态小部件的时候是我需要 AutomaticKeepAliveClientMixin 的时候。

通过将 SingleGetTickerProviderMixin 添加到 Getx 类并在那里执行通常会使有状态小部件困惑的所有操作，甚至可以使用 GetX 中的无状态小部件来完成动画。