我试图了解当 TextFormField 中的值发生更改时,如何在 Flutter 应用程序中使用 GetX 包在文本小部件中获取 react 性更新。 Text 小部件中显示的是可观察对象的属性。它是从 TextFormField 更新的属性。 该值已在 Controller 中正确更新,但未在小部件中正确更新。 如果我直接使用字符串变量,它会正确更新。但是一旦我使用一个对象,它就不再更新了。
这是我的应用程序的一个非常简单的示例,只是为了确保理解这些基础知识。
这是我的代码:
class User {
String name = "";
}
class TestController extends GetxController {
TestController();
final user = User().obs;
}
class MyHomePage extends StatelessWidget {
final c = Get.put(TestController());
final String title;
MyHomePage({this.title});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
),
body: Center(
child: Container(
width: Get.width * 0.8,
height: Get.height * 0.8,
child: Column(
children: [
Obx(() => Text(c.user.value.name)),
TextFormField(
onChanged: (value) => c.user.value.name = value,
),
],
),
),
),
);
}
}
非常感谢您的帮助!
最佳答案
好的,感谢 CodeX youtuber,我找到了解决方案。
为了能够在更改对象的属性值时响应式地更新 UI,即使此对象设置为可观察的,您也需要具有可观察的属性。
所以正确的代码应该是这样的
class User {
final name = "".obs;
}
class TestController extends GetxController {
TestController();
final user = User().obs;
}
class MyHomePage extends StatelessWidget {
final c = Get.put(TestController());
final String title;
MyHomePage({this.title});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
),
body: Center(
child: Container(
width: Get.width * 0.8,
height: Get.height * 0.8,
child: Column(
children: [
Obx(() => Text(c.user.value.name.value)),
TextFormField(
onChanged: (value) => c.user.value.name.value = value,
),
],
),
),
),
);
}
}
关于flutter - 当此属性更改时,如何对显示对象属性的文本小部件进行 react 性更新?这与 GetX,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64444891/