gpt4 book ai didi

Flutter 使用异步数据填充表单

转载 作者:行者123 更新时间:2023-12-03 03:38:00 25 4
gpt4 key购买 nike

我试图获取一个用户,然后用它的数据填充一个表单,但我似乎无法在不违反规则或让表单和状态彼此不同步的情况下做到这一点。

基本上我有一个 FutureBuilder,它获取用户并使用数据设置两个 TextFormField 小部件的 initialValue,但是它的 setState 这里是不允许的,我不确定如何解决它。

我尝试改为在 initState 中获取用户,但这不起作用,因为数据是异步的,所以 initialValue 属性永远不会获取数据。

一直在寻找这方面的众多资源,但没有找到我要找的东西,this接近但似乎需要使用 TextEditingController,如果可能的话我真的很想避免。

正确的做法是什么?

Map form = {};

@override
Widget build(BuildContext context) {
return FutureBuilder(
future: locator<AppAuth>().currentUser(),
builder: (BuildContext context, AsyncSnapshot<FirebaseUser> user) {

if (user.hasData) {

setState(() {
form['displayName'] = user.data.displayName;
form['email'] = user.data.email;
});

return Scaffold(
body: Form(
key: _formKey,
child: Column(
children: <Widget>[
TextFormField(
initialValue: form['displayName'],
onChanged: (v) {
setState(() {
form['displayName'] = v;
});
}
),
TextFormField(
initialValue: form['email'],
onChanged: (v) {
setState(() {
form['email'] = v;
});
}
)
],
/ ... more code ... /

最佳答案

试试这个:

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

class FutureForm extends StatefulWidget {
@override
_FutureFormState createState() => _FutureFormState();
}

class _FutureFormState extends State<FutureForm> {
TextEditingController emailController = TextEditingController(text: "");
TextEditingController nameController = TextEditingController(text: "");

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Demo Future form"),
),
body: buildBody(context),
);
}

Widget buildBody(BuildContext context) {
return FutureBuilder(
future: getCurrentUser(),
builder: (BuildContext context, AsyncSnapshot<User> snapshot) {
if (snapshot.hasData) {
nameController.text = snapshot.data.displayName;
emailController.text = snapshot.data.email;
}
return Form(
child: Column(
children: <Widget>[
TextFormField(
controller: nameController,
),
TextFormField(
controller: emailController,
)
],
));
});
}

Future<User> getCurrentUser() async {
await Future.delayed(Duration(seconds: 2));
return User("Doan Thanh Duong", "doanthanhduong@xmail.com");
}
}

class User {
final String displayName;
final String email;

User(this.displayName, this.email);
}

关于Flutter 使用异步数据填充表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59353637/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com