有类似的问题，但他们的情况和解决方案不适用于我的情况。我在表格中的所有其他输入工作正常，但我已经撞墙了两个星期试图找出这个问题。
请原谅这些代码，我们正在迁移auth服务，我必须找到一种方法来处理同一数据的多个结构，并检测使用了哪种登录方法，但这是一个切线。
无论如何，这是我的代码。我在Flutter开发方面相对较新，所以请告诉我我是否做了一些愚蠢的事情。
import 'package:clash_of_the_pencils/widgets/body_text.dart';
import 'package:clash_of_the_pencils/widgets/box_container.dart';
import 'package:clash_of_the_pencils/widgets/general_button.dart';
import 'package:clash_of_the_pencils/widgets/heading_text.dart';
import 'package:clash_of_the_pencils/widgets/input_field.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:clash_of_the_pencils/models/auth_model.dart';
import 'package:go_router/go_router.dart';
import 'package:provider/provider.dart';
class RegistrationForm extends StatefulWidget {
const RegistrationForm({super.key});
@override
State<RegistrationForm> createState() => RegistrationFormState();
}
class RegistrationFormState extends State<RegistrationForm> {
String errorMessage = "";
String successMessage = "";
bool _pwObscure = true;
String firstName = "";
String lastName = "";
String codename = "";
String email = "";
String _password = "";
String codenameStr = "https://app.xxxxxxxxxxxxxxx.com/codename";
String dob = "";
@override
Widget build(BuildContext context) {
final user = context.watch<AuthModel>().user;
return MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => AuthModel()),
],
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 20),
child: Center(
child: SingleChildScrollView(
child: Form(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
//* Top Heading and test
TextHeadings(
title: user['name'] != null
? "Just a few more details"
: "Registration",
textSize: 45,
),
const SizedBox(height: 10),
//* Box with the form
CustomBoxContainer(
boxContent: Center(
child: Column(children: [
//* Form Description
BodyText(
title: user['name'] != null
? "Complete the form below to finish registration"
: "Complete the form to create an account",
textSize: 18,
textColor: Colors.white,
textAlign: TextAlign.center,
fontWeight: FontWeight.bold,
),
const SizedBox(height: 25),
//* Error message
Container(
child: errorMessage != ""
? (Column(
children: [
CustomBoxContainer(
backgroundColor: const Color(0xffef5f5f),
borderColor: const Color(0xffef2828),
boxContent: BodyText(
title: errorMessage,
textAlign: TextAlign.center,
fontWeight: FontWeight.bold,
textColor: Colors.white,
),
),
const SizedBox(height: 25),
],
))
: null,
),
//* Success message
Container(
child: successMessage != ""
? (Column(
children: [
CustomBoxContainer(
backgroundColor: const Color(0xff79b441),
borderColor: const Color(0xff17974e),
boxContent: BodyText(
title: successMessage,
textAlign: TextAlign.center,
fontWeight: FontWeight.bold,
textColor: Colors.white,
),
),
const SizedBox(height: 25),
],
))
: null,
),
//* Codename Field
InputField(
child: TextFormField(
initialValue:
user[codenameStr] ?? user['nickname'] ?? codename,
decoration: const InputDecoration(
border: InputBorder.none,
labelText: "Codename",
hintText: "Choose a cool codename",
),
onChanged: (value) => setState(() {
codename = value;
}),
)),
const SizedBox(height: 10),
//* First Name Field
user['given_name'] == null
? InputField(
child: TextFormField(
decoration: const InputDecoration(
border: InputBorder.none,
hintText: "What's your first name?",
labelText: "First Name",
),
onChanged: (value) => {
setState(() {
firstName = value;
}),
},
initialValue: firstName.isNotEmpty
? firstName
: user['given_name'] ?? "",
),
)
: const SizedBox(
height: 0,
),
const SizedBox(height: 10),
//* Last Name Field
user['family_name'] == null
? InputField(
child: TextFormField(
decoration: const InputDecoration(
border: InputBorder.none,
hintText: "What's your last name?",
labelText: "Last Name",
),
onChanged: (value) => {
setState(() {
lastName = value;
}),
},
initialValue: lastName.isNotEmpty
? lastName
: user['family_name'] ?? ''))
: const SizedBox(height: 0),
SizedBox(height: user['family_name'] == null ? 10 : 0),
//* Email Field
user['email'] == null
? InputField(
child: TextFormField(
decoration: const InputDecoration(
border: InputBorder.none,
hintText: "someone@email.com",
labelText: "Email",
),
initialValue: email.isNotEmpty
? email
: user['email'] ?? '',
))
: const SizedBox(height: 0),
SizedBox(height: user['email'] == null ? 10 : 0),
//* DOB Field
InputField(
child: TextFormField(
readOnly: true,
decoration: InputDecoration(
border: InputBorder.none,
labelText: 'Date of Birth',
suffixIcon: IconButton(
icon: const Icon(Icons.edit),
onPressed: () => showDatePicker(
initialDatePickerMode: DatePickerMode.year,
context: context,
initialDate: DateTime.now().subtract(
const Duration(days: 365 * 13)),
firstDate: DateTime(1900),
lastDate: DateTime.now().subtract(
const Duration(days: 365 * 13)))
.then(
(value) => {
setState(() {
dob =
'${value!.month.toString()}/${value.day.toString()}/${value.year.toString()}';
})
},
),
),
),
initialValue: dob,
)),
const SizedBox(height: 10),
// Password field
InputField(
child: TextFormField(
decoration: InputDecoration(
border: InputBorder.none,
labelText: 'Password',
suffixIcon: IconButton(
icon: Icon(_pwObscure
? Icons.visibility_off
: Icons.visibility),
onPressed: () {
setState(() {
_pwObscure = !_pwObscure;
});
},
)),
initialValue: _password.isNotEmpty ? _password : "",
obscureText: _pwObscure,
enableSuggestions: false,
onChanged: (value) => {
setState(() => {
if (!_pwObscure) _pwObscure = true,
_password = value,
}),
setState(() {
_pwObscure = true;
})
},
),
),
const SizedBox(height: 15),
//* Submit BTN
GeneralButton(
onPressed: () async {
// ignore: todo
// TODO: Write validation functions
Map<String, dynamic> userMetaData = {
'codename': codename.isNotEmpty
? codename
: user['nickname'],
'password': _password.isNotEmpty
? _password
: user['password'],
'dob': dob,
};
context
.read<AuthModel>()
.updateAuth0User({"user_metadata": userMetaData});
if (kDebugMode) {
print("***** Form Values Submitted");
}
},
buttonText: "Register",
),
const SizedBox(height: 15),
//* Separator
user['name'] == null
? const BodyText(
title: "- OR -",
textColor: Colors.white,
)
: const SizedBox(height: 0),
SizedBox(height: user['name'] == null ? 15 : 0),
//* Auth0 button
user['name'] == null
? GeneralButton(
onPressed: () {
Provider.of<AuthModel>(context, listen: false)
.login(true);
},
buttonText: "Register using auth0",
bgColor: Colors.white,
textColor: const Color(0xffFF7F34),
borderColor: const Color(0xffFF7F34),
)
: const SizedBox(height: 0),
]))),
user['name'] == null
? const SizedBox(height: 15)
: const SizedBox(height: 0),
//* Text for registering
user['name'] == null
? Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const BodyText(
title: "Already a member? ",
fontWeight: FontWeight.bold,
textColor: Colors.white,
textSize: 18,
),
GestureDetector(
onTap: () {
context.push('/login');
},
child: const BodyText(
title: "SIGN IN!",
fontWeight: FontWeight.bold,
textColor: Color(0xffFF7F34),
textSize: 18),
)
],
)
: const SizedBox(height: 0),
])),
),
),
));
}
@override
void dispose() {
super.dispose();
}
}我从DatePicker中选择了一个日期。我希望UI显示我选择的日期。它没有显示。我的formvalues更新了，但新值没有显示，因为它与所有其他输入。
1条答案
按热度按时间ldioqlga1#
您必须使用
TextEditingController到setState进行控制。您需要使用controller来设置状态，而不是使用initalValue。