setstate 函数在 flutter 中不起作用

Question

    import 'package:flutter/material.dart';
    import 'package:flutter_application_1/pages/home_page.dart';
    import 'package:flutter_application_1/utils/routes.dart';
    
    class LoginPage extends StatefulWidget {
      const LoginPage({Key? key}) : super(key: key);
    
      @override
      State<LoginPage> createState() => _LoginPageState();
    }
    
    class _LoginPageState extends State<LoginPage> {
      @override
      Widget build(BuildContext context) {
        String x = '';
        return Material(
            // wrap column with singlechildscrollview widget
            child: SingleChildScrollView(
          child: Column(
            children: [
              SizedBox(
                height: 28,
              ),
              Image.asset(
                "assets/images/login_image.png",
                fit: BoxFit.contain,
              ),
              SizedBox(
                height: 20.0,
              ),
              Text("Welcome $x",
                  style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold)),
              SizedBox(
                height: 20,
              ),
              // wrapping a column with Padding
              Padding(
                padding:
                    const EdgeInsets.symmetric(vertical: 16.0, horizontal: 32.0),
                child: Column(
                  children: [
                    TextFormField(
                      decoration: InputDecoration(
                          hintText: "Enter Username", labelText: "Username"),
                      onChanged: (value) {
                        x = value;
                        setState(() {});
                      },
                    ),
                    TextFormField(
                      obscureText: true,
                      decoration: InputDecoration(
                          hintText: "Enter Password", labelText: "Password"),
                    ),
                    SizedBox(
                      height: 30,
                    ),
                    ElevatedButton(
                      child: Text("Login"),
                      style: TextButton.styleFrom(minimumSize: Size(150, 40)),
                      onPressed: () {
                        print("hello");
                      },
                    )
                  ],
                ),
              ),
            ],
          ),
        ));
      }
    }

我是 Flutter 的新手，当时我正在学习有状态的小部件。我正面临这个问题。setstate() 无法正常工作，编译器没有显示任何错误。基本上我希望当有人在用户名文本字段中输入字符串时，该值应该与“欢迎”一起附加。

Answer 1

问题是您在 build 函数中分配了 String x = '';，并且在 widget 重建时它总是分配空字符串。

只需在build函数外赋值即可。

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

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  String x = '';
  @override
  Widget build(BuildContext context) {
    return Material(
        // wrap column with singlechildscrollview widget
        child: SingleChildScrollView(
      child: Column(
        children: [
          SizedBox(
            height: 28,
          ),
          Image.asset(
            "assets/images/login_image.png",
            fit: BoxFit.contain,
          ),
          SizedBox(
            height: 20.0,
          ),
          Text("Welcome $x",
              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold)),
          SizedBox(
            height: 20,
          ),
          // wrapping a column with Padding
          Padding(
            padding:
                const EdgeInsets.symmetric(vertical: 16.0, horizontal: 32.0),
            child: Column(
              children: [
                TextFormField(
                  decoration: InputDecoration(
                      hintText: "Enter Username", labelText: "Username"),
                  onChanged: (value) {
                    x = value;
                    print(value);
                    setState(() {});
                  },
                ),
                TextFormField(
                  obscureText: true,
                  decoration: InputDecoration(
                      hintText: "Enter Password", labelText: "Password"),
                ),
                SizedBox(
                  height: 30,
                ),
                ElevatedButton(
                  child: Text("Login"),
                  style: TextButton.styleFrom(minimumSize: Size(150, 40)),
                  onPressed: () {
                    print("hello");
                  },
                )
              ],
            ),
          ),
        ],
      ),
    ));
  }
}

Answer 2

尝试在 build 方法之外声明您的 state variable。

class _LoginPageState extends State<LoginPage> {
      String x = '';

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

Answer 3

你应该把 String x = ''; 放在 Widget 外面，见下文：

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

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  String x = '';
  @override
  Widget build(BuildContext context) {
    ...

setstate 函数在 flutter 中不起作用

setstate function is not working in flutter

setstate

dart

flutter