以下是一个包含代码示例的解决方法:
import 'package:flutter/material.dart';
class MyButton extends StatefulWidget {
@override
_MyButtonState createState() => _MyButtonState();
}
class _MyButtonState extends State {
bool isLoading = false;
bool isButtonDisabled = false;
Future fetchData() async {
setState(() {
isLoading = true;
isButtonDisabled = true;
});
// 模拟一个异步操作,例如从后端获取数据
await Future.delayed(Duration(seconds: 2));
setState(() {
isLoading = false;
isButtonDisabled = false;
});
}
@override
Widget build(BuildContext context) {
return RaisedButton(
onPressed: isButtonDisabled ? null : fetchData,
child: isLoading ? CircularProgressIndicator() : Text('Fetch Data'),
);
}
}
void main() {
runApp(MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Button Example'),
),
body: Center(
child: MyButton(),
),
),
));
}
在上面的示例中,我们创建了一个名为MyButton
的StatefulWidget
,其中包含了一个异步方法fetchData
,该方法在按钮的onPressed
事件中调用。在fetchData
方法中,我们使用了两个setState
来更新两个状态变量isLoading
和isButtonDisabled
。当按钮被点击时,我们将isLoading
设置为true
,并将isButtonDisabled
设置为true
,这样按钮将被禁用并显示一个加载指示器。在异步操作完成后,我们再次使用setState
将isLoading
设置为false
,并将isButtonDisabled
设置为false
,从而使按钮恢复可点击状态。
上一篇:按钮 onclick 的奇怪行为
下一篇:按钮 Xamarin/C#