当我按下后退按钮或移除我的键盘时，文本字段中的文本消失

Question

我对这段代码有疑问：

此登录页面：

class LoginPage extends StatefulWidget {
  const LoginPage({Key? key}) : super(key: key);

  @override
  _LoginPageState createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  @override
  Widget build(BuildContext context) {
    final TextEditingController _emailController = TextEditingController();
    final TextEditingController _passwordController = TextEditingController();
    double h = MediaQuery.of(context).size.height;

    return Scaffold(
      backgroundColor: Colors.white,
      body: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            const AuthHeader(
              firstText: 'Login', 
              secText: 'Sign into your account',
              flip: false,
              beginC: Alignment.topRight,
              endC: Alignment.bottomLeft,
              caAlignment: CrossAxisAlignment.start,
            ),
            SizedBox(height: h * 0.05),
            TextFieldAuth(
              controller: _emailController,
              hintText: 'E-Mail',
              icon: Icons.mail,
            ),
            SizedBox(height: h * 0.03),
            TextFieldAuth(
              controller: _passwordController,
              hintText: 'Password',
              icon: Icons.password,
            ),
            SizedBox(height: h * 0.06),
            const ButtonAuth(
              text: 'Sign In',
            ),
            SizedBox(height: h * 0.07),
            AuthRichText(
              firstText: 'Don\'t have account? ',
              secText: 'Create',
              recognizer: TapGestureRecognizer()..onTap = () {
                Get.toNamed('/signup');
              }
            ),
            SizedBox(height: h * 0.03),
            const DividerAuth(),
            SizedBox(height: h * 0.02),
            const GroupAuthButton(),
          ],
        ),
      ),
    );
  }
}

此注册页面：

class SignUpPage extends StatefulWidget {
  const SignUpPage({Key? key}) : super(key: key);

  @override
  _SignUpPageState createState() => _SignUpPageState();
}

class _SignUpPageState extends State<SignUpPage> {
  @override
  Widget build(BuildContext context) {
    final TextEditingController _emailController = TextEditingController();
    final TextEditingController _passwordController = TextEditingController();
    double h = MediaQuery.of(context).size.height;
    return Scaffold(
      body: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            const AuthHeader(
              firstText: 'SignUp',
              secText: 'Create your account',
              flip: true,
              beginC: Alignment.bottomLeft,
              endC: Alignment.topRight,
              caAlignment: CrossAxisAlignment.end,
            ),
            SizedBox(height: h * 0.05),
            TextFieldAuth(
              controller: _emailController,
              hintText: 'E-Mail',
              icon: Icons.mail,
            ),
            SizedBox(height: h * 0.03),
            TextFieldAuth(
              controller: _passwordController,
              hintText: 'Password',
              icon: Icons.password,
            ),
            SizedBox(height: h * 0.06),
            const ButtonAuth(
              text: 'Sign Up',
            ),
            SizedBox(height: h * 0.07),
 

       AuthRichText(
          firstText: 'Have account? ',
          secText: 'Sign In',
          recognizer: TapGestureRecognizer()..onTap = () {
            Get.back();
          }
        ),
        SizedBox(height: h * 0.03),
        const DividerAuth(),
        SizedBox(height: h * 0.02),
        const GroupAuthButton(),
      ],
    ),
  ),
);

} }

这是文本字段：

import 'package:flutter/material.dart';

class TextFieldAuth extends StatelessWidget {
  const TextFieldAuth({
    Key? key,
    this.hintText, this.icon, this.controller,
  }) : super(key: key);

  final String? hintText;
  final IconData? icon;
  final TextEditingController? controller;

  @override
  Widget build(BuildContext context) {
    double w = MediaQuery.of(context).size.width;
    return Container(
      width: w * 0.90,
      decoration: const BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(20)),
        boxShadow: [
          BoxShadow(
            blurRadius: 10,
            spreadRadius : 2,
            offset: Offset(0, 8),
            color: Colors.grey
          )
        ]
      ),
      child: TextField(
        controller: controller,
        decoration: InputDecoration(
          hintText: hintText,
          fillColor: Colors.white,
          prefixIcon: Icon(icon, color: Colors.redAccent,),
          filled: true,
          border: const OutlineInputBorder(
            borderSide: BorderSide.none,
            borderRadius: BorderRadius.all(Radius.circular(20))
          )
        ),
      ),
    );
  }
}

我不知道为什么这会突然发生，即使以前这段代码是运行 fine.when 我在 TextField 中输入文本，当我关闭键盘或我按后退按钮。这个问题能解决吗？

Answer 1

您不应在 build 方法中创建 TextEditingControllers。每次小部件重建时（例如，在调用 setState() 或简单地热重新加载之后），您的控制器将被重新创建，因此它们存储的值将丢失。你应该直接在状态中实例化你的控制器，像这样：

  class _SignUpPageState extends State<SignUpPage> {
    final TextEditingController _emailController = TextEditingController();
    final TextEditingController _passwordController = TextEditingController();

    @override
    Widget build(BuildContext context) {
     ...

此外，当您不再需要控制器时，请不要忘记丢弃它们。把这个函数放在你的状态 class:

  @override
  void dispose() {
    _emailController.dispose();
    _passwordController.dispose();
    super.dispose();
  }

更多信息请参考：

https://api.flutter.dev/flutter/widgets/TextEditingController-class.html

https://flutter.dev/docs/cookbook/forms/text-field-changes#2-use-a-texteditingcontroller

当我按下后退按钮或移除我的键盘时，文本字段中的文本消失

the text in textfield disappears when I press the back button or remove my keyboard

textfield

uitextfield

dart

flutter