为什么我的 Flutter 在第一次输入数字时不显示输入的内容

Question

我的代码：

             Padding(
              padding: const EdgeInsets.only(bottom: 3.0),
              child: SizedBox(
                width: double.infinity,
                child: GestureDetector(
                  onTap: () {},
                  child: Form(
                    child: TextFormField(
                      inputFormatters: <TextInputFormatter>[
                        FilteringTextInputFormatter.digitsOnly,
                      ],
                      keyboardType: TextInputType.number,
                      controller: TextEditingController(text: formData.pin),
                      decoration: const InputDecoration(
                        border: UnderlineInputBorder(),
                        labelText: 'PIN 2',
                      ),
                      onChanged: (newValue) => formData.pin = newValue,
                    ),
                  ),
                ),
              ),
            ),

我的问题，首次输入时 PIN 列不显示数字，您必须再次点击才能显示数字，我在下面附上了一个 gif。 :

我希望PIN栏可以在第一次输入时显示数字

Answer 1

请勿在

TextEditingController

方法内初始化

build

。将控制器变量移动到状态，并在

initState

中初始化它（您必须使用

StatefulWidget

。

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});

  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  late TextEditingController pinController; // (1) Define the controller variable

  @override
  void initState() {
    super.initState();
    pinController = TextEditingController(); // (2) Initialize it
  }

  @override
  void dispose() {
    pinController.dispose(); // (3) Don't forget to dispose after
    super.dispose();
  }

  // ...
}

现在在小部件中使用它，如下所示：

TextFormField(
  controller: pinController,
  // ...
)