Question

是我的新手，我尝试在文本字段中键入时执行onchange值，该值正在更新“文本”小部件。

我尝试了两种方法，一种是从onchanged，另一种是使用TextEditingController，都没有用。

final txtController = TextEditingController();
String onchangeval = "";

TextFormField(
  onChanged: (value){
    onchangeval = value;
  },
  controller: txtController
),
Text("value_1 : " + onchangeval),
Text("value_2 : " + txtController.text),

注意：当前正在使用扩展HookWidget

Answer 1

您需要调用setState（），它告诉框架小部件的状态已更改，并且应该重绘小部件。

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  final txtController = TextEditingController();
  String onchangeval = "";

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        TextFormField(
            onChanged: (value) {
              setState(() {
                onchangeval = value;
              });
            },
            controller: txtController),
        Text("value_1 : " + onchangeval),
        Text("value_2 : " + txtController.text),
      ],
    );
  }
}

Answer 2

您必须将其放在setstate中。文档：https://api.flutter.dev/flutter/widgets/State/setState.html

要使setstate工作，您必须将小部件类型更改为StatefulWidget

final txtController = TextEditingController();
String onchangeval = "";

TextFormField(
  onChanged: (value){
setState(() {
    onchangeval = value;
});
  },
  controller: txtController
),
Text("value_1 : " + onchangeval),
Text("value_2 : " + txtController.text),

每次您要在应用中进行视觉更改时，都必须使用可能更改的状态。

Answer 3

您应该使用setState()

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

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

class _MyHomePageState extends State<MyHomePage> {
  final txtController = TextEditingController();
  String onchangeval = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextFormField(
                onChanged: (value) {
                  setState(() {
                    onchangeval = value;
                  });
                },
                controller: txtController),
            Text(
              onchangeval,
            ),
          ],
        ),
      ),
    );
  }
}

引用：https://api.flutter.dev/flutter/widgets/StatefulWidget-class.html

Flutter：将TextFormField onchange值更改为Text小部件

3 个答案: