我在Flutter应用程序中遇到一个问题,在AlertDialog中单击“Yes”按钮后,我想在进行API调用后显示SnackBar。工作流程如下:
1.用户点击按钮,触发AlertDialog。
1.在AlertDialog中,用户可以选择单击“Yes”。点击“是”后,我需要立即关闭AlertDialog并开始进行API调用。
1.在API调用期间,我希望在屏幕上显示一个加载指示器。
- API调用完成后,我想显示一个SnackBar
基于结果。
我遇到的问题是,在弹出AlertDialog以显示SnackBar之后,上下文为null,这阻止了我显示SnackBar。
class MyProvider extends ChangeNotifier {
bool _loader = false;
bool get loader => _loader;
Future<bool> fakeApiCall() async {
_loader = true;
notifyListeners();
await Future.delayed(Duration(seconds: 3));
_loader = false;
notifyListeners();
return true;
}
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
final myProvider = context.watch<MyProvider>();
return Scaffold(
appBar: AppBar(),
body: myProvider.loader
? const Center(
child: CircularProgressIndicator(),
)
: Center(
child: ElevatedButton(
onPressed: () async {
await showDialog(
context: context,
builder: (context) {
return AlertDialog(
content: const Text("Alert"),
actions: [
TextButton(
onPressed: () async {
Navigator.pop(context);
context
.read<MyProvider>()
.fakeApiCall()
.then((value) {
if (value) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text("Snackbar Showed")));
}
});
},
child: const Text("Yes"),
)
],
);
},
);
},
child: const Text("Tap"),
),
),
);
}
}
我尝试了不同的方法,包括传递BuildContext和使用GlobalKey,但我无法解决这个问题。
我很感激任何关于如何正确管理上下文的见解或建议,以便我可以在API调用后显示SnackBar。
1条答案
按热度按时间wbrvyc0a1#
你可以做一个小部件来处理按钮,点击时显示警报,当你点击“是”时,警报弹出上下文,然后使用回调函数作为参数传递给你的小部件。
现在,在调用新的自定义小部件的父小部件类中,可以实现回调,它调用API并显示snackBar。