如何解决如何在riverpod中进行http.post调用?
我正在尝试进行后调用,将表单数据发送到 API 并获得响应。
我想做一个网络后调用,它发送手机、密码,并从 user_repo 获取用户数据并将其存储在将来可以访问的状态。
我不确定如何添加用户状态提供程序并在按下按钮时调用它。
例如:
我的 AuthScreen:这是实现 Ui 的地方。
class AuthScreen extends StatefulWidget {
@override
_AuthScreenState createState() => _AuthScreenState();
}
class _AuthScreenState extends State<AuthScreen> {
TextEditingController _phoneController;
TextEditingController _passwordController;
bool _isHidden = true;
void _togglePasswordView() {
setState(() {
_isHidden = !_isHidden;
});
}
@override
void initState() {
super.initState();
_phoneController = TextEditingController();
_passwordController = TextEditingController();
}
@override
void dispose() {
_phoneController.dispose();
_passwordController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
backgroundColor: Colors.white,resizeToAvoidBottomInset: false,body: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,crossAxisAlignment: CrossAxisAlignment.start,children: [
Text(
'Login',style: TextStyle(
fontSize: 24.0,fontWeight: FontWeight.w500,),TextField(
keyboardType: TextInputType.phone,controller: _phoneController,decoration: InputDecoration(
prefixIcon: Icon(Icons.phone_android),hintText: 'Enter your registered mobile number'),TextField(
controller: _passwordController,decoration: InputDecoration(
prefixIcon: Icon(Icons.lock),hintText: 'Enter your password',suffixIcon: InkWell(
child: Icon(
_isHidden ? Icons.visibility_off : Icons.visibility),onTap: _togglePasswordView,obscureText: _isHidden,RaisedButton(
onPressed: ()=>{},child: Text("login"),],);
}
我应该为 onPressed 写什么? context.read(userState)??
用户模式:
class UserData {
UserData({
this.id,this.name,this.mobile,this.email,this.image,});
String id;
String name;
String mobile;
String email;
String image;
factory UserData.fromJson(Map<String,dynamic> json) => UserData(
id: json["id"],name: json["name"],mobile: json["mobile"],email: json["email"],image: json["image"],);
Map<String,dynamic> toJson() => {
"id": id,"name": name,"mobile": mobile,"email": email,"image": image,};
}
用户仓库:
class UserRepository {
Future<dynamic> fetchUser(String mobile,String password) async {
var body = {"mobile": mobile,"password": password};
final response = await _implementation.post(my_url,body: body);
return response;
}
}
状态:
final userState = FutureProvider<dynamic>((ref) async {
UserRepository().fetchUser(mobile,password);
// How to make this work??
});
编辑: Tayormi 提供的解决方案运行良好。
我添加了一些代码来存储需要访问的用户。
在状态提供程序下创建以存储用户:
final userData = StateProvider<UserData>((ref) => null);
将 userProvider 修改为:
final userProvider = StateNotifierProvider<UserController>((ref) {
final user = ref.read(userData);
return UserController(user);
});
在 userController 的 try 块中,我们可以更新 userData 如下:
class UserController extends StateNotifier<FetchUserState> {
final userData;
UserController(this.userData) : super(UserFetchInitial());
void fetchUser(String mobile,String password) async {
final userRepo = UserRepository();
state = UserFetching();
try {
final response = await userRepo.fetchUser(mobile,password);
if (response.id != null) {
userData.state = response;
state = UserFetched();
} else {
state = UserFetchError();
}
} catch (error) {
print(error);
state = UserFetchError();
}
}
}
感谢@Tayormi 帮助我找到解决方案..
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。