0

我正在学习 GetX。我正在尝试编写显示文本字段并允许对其进行编辑的简单应用程序。所以用户可以点击默认文本并继续编辑它。

但我对onChange动作和控制器感到困惑。我不确定我是否正确使用它们，因为下一个代码不会在控制台中打印注释，所以它似乎TextEditingController没有与数据绑定。

这里复制过去的代码：

import 'package:flutter/material.dart';
import 'package:flutter_application_1/controller.dart';
import 'package:get/get_core/src/get_main.dart';
import 'package:get/get.dart';


void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  var mycontroller = Get.put(MyController());

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        body: Container(child: TextField(
              controller: TextEditingController(text: mycontroller.text),
              onChanged: (value) {
                mycontroller.changeText();
              }
      ))
    ));
  }
}

控制器：

import 'package:flutter/material.dart';
import 'package:get/get_state_manager/get_state_manager.dart';
import 'package:get/get_rx/src/rx_types/rx_types.dart';

class MyController extends GetxController {

    var _text = "".obs;
    TextEditingController _controller;

    get text => this._text.value;
    set text(value) => this._text.value = value;
    
    @override
    void onInit() async  {
      super.onInit();
      _controller = TextEditingController();
      _text.value = "Hello World"; 

       _controller.addListener(changeText);
    }

    changeText() {
      _text.value = _controller.text;
      print(_text.value); // nothing is printed on Console!
    }

}

还有第二个问题。如果我需要两个文本字段，我需要如何组织代码？我需要不同的_controller.addListener(changeText);喜欢：_controller.addListener(changeText1); _controller.addListener(changeText2);？

4

2 回答 2

0

可以通过使用 Textfieldcontroller 以及使用 onchanged 方法在文本字段更改时获取它的值，您正在将它们都部署在代码中，这不是必需的。您可以通过任何一种方式监控文本字段值。在此处阅读更多内容 https://flutter.dev/docs/cookbook/forms/text-field-changes。

如果您希望使用 Textfieldcontroller，则需要在 MyController 中创建它（Textfieldcontroller），这有点复杂，我不使用这种方法。下面提到了如何将 onchanged 与 GetX 一起使用。

我的控制器.dart

var _text = "".obs;

get getText => _text.value;
set setText(String screenvalue) => _text.value = screenvalue;

// there is no need of initiating textcontroller here in mycontroller.dart

yourscreen.dart

class MyApp extends StatelessWidget {
  final mycontroller = Get.put(MyController());
  // intiate TextEditingController in screen
  var textValueController = TextEditingController();

home: Scaffold(
  body: 
  
Column(
children: [  
  
  Container(child: TextField(
    // initiate TextEditingController normally in screen itself 
    // if you wish to use it for purpose of submitting form data
    // or for validation purpose
    controller: textValueController,
    onChanged: (value) {
      mycontroller.setText (value);
    }
  )),

  Obx(() {
    return Text(
      'Your text updated as typed = ${mycontroller.getText}',
    );
  }),
  
],
))}
于 2021-11-14T09:34:45.667 回答
0

德米特里，

我也在学习 GetX，所以还没有 100% 掌握它。

作为初学者，您似乎正在使用两个不同的 TextEditingControllers！MyController 中的一个和 MyApp 中的一个可能需要使 MyController 不是私有的并在 MyApp 上使用它。

第二个问题很简单，因为您可以/应该为每个文本字段创建一个 TextEditingController。

于 2021-09-10T16:44:35.787 回答