【发布时间】:2021-10-06 13:44:56
【问题描述】:
我创建了一个用户配置文件屏幕,用户还可以通过单击编辑按钮来编辑字段,它会出现一个弹出对话框,其中我显示允许编辑的字段。我正在使用 API,我使用 NodeJS 创建它来更新这些字段,它正在工作,值正在更新。
问题:
编辑对话框中有 5 个字段(电子邮件、电话号码、地址、教育和军事状态),但是如果用户只想编辑教育字段,并且希望其余字段保持不变,并且当用户单击更新更改按钮时我调用 api,它只更新已编辑的字段并将另一个字段更新为 null,因为它从字段控制器获取空值(我将文本字段控制器传递给 api 正文参数)。
我认为的解决方案:
可以使用条件 (if-else) 来处理 null 值,方法是传递我使用共享首选项获得的旧值,但这效率不高,因为还有 5 个字段,但是如果将来如果编辑字段数量增加,则需要更多条件(检查)。
这里是后端 api 代码:
updateprofile = (req,res)=>{
jwt.verify(req.body.token, 'secret' , function(err, decoded) {
if(err) {
err["expiredAt"] = err["expiredAt"].toLocaleString();
res.status(300).json(err)
}
else
{
User.find({"username":req.body.username,_id: req.body.id},function(err,data){
console.log(req.body)
User.updateOne({"username":req.body.username, _id: req.body.id}, {"email":req.body.email,"education":req.body.education,"PhoneNo":req.body.PhoneNo,"address":req.body.address,"martialstatus":req.body.martialstatus},function(err,dat){
if(err)
res.json("You Last login Yesterday");
else
{
var token = jwt.sign({
data: 'foobar'
}, 'secret', { expiresIn: "30 minute"})
res.status(200).json({auth: true, AccessToken: token,email:req.body.email,education:req.body.education,phone:req.body.PhoneNo,address:req.body.address,martialstatus:req.body.martialstatus})
}
})})
}})}
这里是编辑对话框和共享偏好代码:
String getname="";
String getemail="";
String getdesignation="";
String getType="";
String getId="";
String getToken="";
String getEducation="";
String getPhone="";
String getMartialStatus="";
String getAddress="";
String getDob="";
_userDetails() async{
SharedPreferences myPrefs=await SharedPreferences.getInstance();
setState(() {
getname=myPrefs.getString('name');
getemail=myPrefs.getString('email');
getdesignation=myPrefs.getString('designation');
getType=myPrefs.getString('type');
getId=myPrefs.getString('UserId');
getToken=myPrefs.getString('accesstoken');
getPhone=myPrefs.getString('phone');
getEducation=myPrefs.getString('education');
getMartialStatus=myPrefs.getString('martialstatus');
getAddress=myPrefs.get('address');
getDob=myPrefs.get('DOB');
});
}
_displayTextInputDialog(BuildContext context) {
return showDialog(
context: context,
builder: (context) {
return
Center(child:
Column(children: <Widget>[
AlertDialog(
title: Text('Profile Edit'),
content: Column(children: <Widget>[
TextField(
onChanged: (value) {
setState(() {
valueText = value;
});
},
controller: email,
decoration: InputDecoration(hintText: getemail,icon: Icon(Icons.email)),
),
TextField(
onChanged: (value) {
setState(() {
valueText = value;
});
},
controller: phone,
decoration: InputDecoration(hintText: getPhone,icon: Icon(Icons.phone)),
),
TextField(
onChanged: (value) {
setState(() {
valueText = value;
});
},
controller: address,
decoration: InputDecoration(hintText: getAddress,icon: Icon(Icons.location_on)),
),
TextField(
onChanged: (value) {
setState(() {
valueText = value;
});
},
controller: education,
decoration: InputDecoration(hintText: getEducation,icon: Icon(Icons.library_books)),
),
TextField(
onChanged: (value) {
setState(() {
valueText = value;
});
},
controller: martialstatus,
decoration: InputDecoration(hintText: getMartialStatus,icon: Icon(Icons.group)
),
)],),
actions: <Widget>[
FlatButton(
color: Colors.green,
textColor: Colors.white,
child: Text('Update Changes'),
onPressed: () {
setState(() {
valuebutton = valueText;
updateProfile(); //here calling the api function to udpate the values
Navigator.pop(context);
});
},
),
],)
],
));
});
}
我在这里使用 api 并在更新更改按钮上调用函数
Dio dio = new Dio();
var data={};
Future updateProfile() async {
try{
var data={
"username":getname,
"id":getId,
"token":getToken,
"email":email.text,
"PhoneNo":phone.text,
"martialstatus":martialstatus.text,
"address":address.text,
"education":education.text
}; dio
.post(localHostUrlUpdateProfile, data: json.encode(data))
.then((onResponse) async {
showDialog(context: context,
builder: (BuildContext context){
return AdvanceCustomAlert(
title: "Profile Updated",
descriptions:"Profile is updated successfully!",icon: Icons.check,
bgcolor: Colors.green,
fgcolor: Colors.green,);
}
);
});}
catch (e) {
print("error");
bool checkStatus =
OSError.noErrorCode == 113 || OSError.noErrorCode == 101;
print(checkStatus);
print(OSError.noErrorCode == 113);
if (e is DioError) {
print(e.response);
}
if (checkStatus == false) {
print("con er");
showDialog(
context: context,
builder: (BuildContext context) {
return AdvanceCustomAlert(
title: "Connection Error",
descriptions: "An unknown network error occured.",
icon: Icons.error,
bgcolor: Colors.red,
fgcolor: Colors.red,
);
});
}
}
}
希望一切都清楚,如果有人知道如何做到这一点,请提供帮助。
【问题讨论】:
标签: node.js mongodb flutter api textfield